Uploaded image for project: 'Titanium SDK/CLI'
  1. Titanium SDK/CLI
  2. TIMOB-26177

Windows: "focus" and "blur" events bubbles to parent views when it shouldn't

    Details

    • Story Points:
      8
    • Sprint:
      2016 Sprint 17 SDK, 2018 Sprint 18 SDK, 2018 Sprint 19 SDK, 2018 Sprint 20 SDK

      Description

      Summary:
      A view's focus and blur events are not supposed to bubble up to the view's parents according to our documentation here...
      https://docs.appcelerator.com/platform/latest/#!/guide/Event_Handling-section-src-29004896_EventHandling-Bubblingandnon-bubblingevents

      On Windows, they do bubble up. This can cause confusion since these events will bubble up to the window which use the focus and blur events to indicate if the window is active, not if it has gained/received input focus.

      This is not an issue on iOS.

      Steps to reproduce:

      1. Build and run the below code on Windows.
      2. If the TextField has the focus, then tap on the "Remove Focus" button.
      3. Tap on the "Set Focus" button.
      4. In the log, notice that the TextField focus event's "bubbles" property is set true. This is wrong.
      5. In the log, notice the Window received a focus event after the TextField did. This is wrong.
      6. Tap on the "Remove Focus" button.
      7. In the log, notice that the TextField blur event's "bubbles" property is set true. This is wrong.
      8. In the log, notice the Window received a blur event after the TextField did. This is wrong.

      var window = Ti.UI.createWindow({
      	layout: "vertical",
      });
      var textField = Ti.UI.createTextField({
      	value: "Focus Test",
      	width: Ti.UI.FILL,
      	height: Ti.UI.SIZE,
      });
      textField.addEventListener("focus", function(e) {
      	Ti.API.info("@@@ TextField 'focus' event received. bubbles: " + e.bubbles);
      });
      textField.addEventListener("blur", function(e) {
      	Ti.API.info("@@@ TextField 'blur' event received. bubbles: " + e.bubbles);
      });
      window.add(textField);
      var focusButton = Ti.UI.createButton({ title: "Set Focus" });
      focusButton.addEventListener("click", function(e) {
      	textField.focus();
      });
      window.add(focusButton);
      var blurButton = Ti.UI.createButton({ title: "Remove Focus" });
      blurButton.addEventListener("click", function(e) {
      	textField.blur();
      });
      window.add(blurButton);
      window.addEventListener("focus", function(e) {
      	Ti.API.info("@@@ Window 'focus' event received.");
      });
      window.addEventListener("blur", function(e) {
      	Ti.API.info("@@@ Window 'blur' event received.");
      });
      window.open();
      

      Expected Result:
      The focus and blur events should not not bubble. Their bubbles property should be false and the parent window should not have received the TextField's events.

        Attachments

          Issue Links

            Activity

              People

              • Assignee:
                kiguchi Kota Iguchi
                Reporter:
                jquick Joshua Quick
                Reviewer:
                Gary Mathews
              • Watchers:
                2 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Backbone Issue Sync

                  • Titanium SDK/CLI <> Titanium Mobile
                    Synced with:
                    TIMOB-6436
                    Sync status:
                    ERROR
                    Last received:
                    Last sent:

                    Git Source Code