@oracle/oraclejet 14.0.6 → 14.1.0

package/dist/js/libs/oj/debug/ojpopup.js

@@ -182,8 +182,8 @@ define(['ojs/ojpopupcore', 'ojs/ojcore-base', 'jquery', 'ojs/ojcontext', 'ojs/oj
      *   <li>"alertdialog" defines type of dialog that contains an alert message, where initial focus
      *       goes to an element within the dialog.</li>
      * </ul>
-     * The popup also adds the <code class="prettyprint">aria-describedby="popup-id"</code> attribute
-     * to the assocaited launcher while the popup is open.
+     * The non-modal (modeless) popup also adds the <code class="prettyprint">aria-describedby="popup-id"</code>
+     * attribute to the assocaited launcher while the popup is open.
      * </p>
      *
      * On platforms that support voice over mode (VO), the popup injects anchor tags "skip links"
@@ -192,12 +192,12 @@ define(['ojs/ojpopupcore', 'ojs/ojcore-base', 'jquery', 'ojs/ojcontext', 'ojs/oj
      *  <ul>
      *    <li>A close link, {@link oj.ojPopup#translations.ariaCloseSkipLink}, is injected as a
      *        sibling to the popup's content. Activation of this link will close the popup.</li>
-     *    <li>For cases where the popup doesn't steal focus when it's open, a content navigation
+     *    <li>For cases where the non-modal popup doesn't steal focus when it's open, a content navigation
      *        skip link, {@link oj.ojPopup#translations.ariaFocusSkipLink}, is injected as a
      *        sibling to the launcher (first required argument of the open method). If the launcher
      *        selector targets a sub-element of the launcher, the skip link could be injected under
      *        the launcher, which can be problematic for oj-button as skip link activation will
-     *        also activate the associated launcher.</li>
+     *        also activate the associated launcher. The focus skip link is not injected for modal popups.</li>
      *  </ul>
      *
      * <p>One point often overlooked is making the gestures that launch a popup accessible.
@@ -1043,7 +1043,9 @@ define(['ojs/ojpopupcore', 'ojs/ojcore-base', 'jquery', 'ojs/ojcontext', 'ojs/oj
         this._setPosition(position);
 
         this._setAutoDismiss(options.autoDismiss);
-        this._addDescribedBy();
+        if (options.modality !== 'modal') {
+          this._addDescribedBy();
+        }
 
         if (!this._IsCustomElement() || !element[0].hasAttribute('role')) {
           element.attr('role', options.role);
@@ -2239,38 +2241,46 @@ define(['ojs/ojpopupcore', 'ojs/ojcore-base', 'jquery', 'ojs/ojcontext', 'ojs/oj
        * @private
        */
       _initVoiceOverAssist: function () {
+        var isModal = this.options.modality === 'modal';
         var isVOSupported =
           oj.AgentUtils.getAgentInfo().os === oj.AgentUtils.OS.IOS ||
           oj.AgentUtils.getAgentInfo().os === oj.AgentUtils.OS.ANDROID;
-        var liveRegion = this._liveRegion;
-        if (!liveRegion) {
-          liveRegion = new ojpopupcore.PopupLiveRegion();
-          this._liveRegion = liveRegion;
-        }
-
         var message;
-        var initialFocus = this._deriveInitialFocus();
-        if (isVOSupported) {
-          message = this.getTranslatedString(
-            initialFocus === 'none'
-              ? 'ariaLiveRegionInitialFocusNoneTouch'
-              : 'ariaLiveRegionInitialFocusFirstFocusableTouch'
-          );
-        } else {
-          message = this.getTranslatedString(
-            initialFocus === 'none'
-              ? 'ariaLiveRegionInitialFocusNone'
-              : 'ariaLiveRegionInitialFocusFirstFocusable'
-          );
+
+        if (!isModal) {
+          // for non-modal popups install the live region for keybard/VO navigation
+          var liveRegion = this._liveRegion;
+          if (!liveRegion) {
+            liveRegion = new ojpopupcore.PopupLiveRegion();
+            this._liveRegion = liveRegion;
+          }
+          var initialFocus = this._deriveInitialFocus();
+          if (isVOSupported) {
+            message = this.getTranslatedString(
+              initialFocus === 'none'
+                ? 'ariaLiveRegionInitialFocusNoneTouch'
+                : 'ariaLiveRegionInitialFocusFirstFocusableTouch'
+            );
+          } else {
+            message = this.getTranslatedString(
+              initialFocus === 'none'
+                ? 'ariaLiveRegionInitialFocusNone'
+                : 'ariaLiveRegionInitialFocusFirstFocusable'
+            );
+          }
+          liveRegion.announce(message);
         }
-        liveRegion.announce(message);
 
         if (isVOSupported) {
-          var focusSkipLinkId = this._getSubId('focusSkipLink');
-          var launcher = this._launcher;
-          var callback = this._intialFocus.bind(this, true);
-          message = this.getTranslatedString('ariaFocusSkipLink');
-          this._focusSkipLink = new ojpopupcore.PopupSkipLink(launcher, message, callback, focusSkipLinkId);
+          var callback;
+
+          if (!isModal) {
+            var focusSkipLinkId = this._getSubId('focusSkipLink');
+            var launcher = this._launcher;
+            callback = this._intialFocus.bind(this, true);
+            message = this.getTranslatedString('ariaFocusSkipLink');
+            this._focusSkipLink = new ojpopupcore.PopupSkipLink(launcher, message, callback, focusSkipLinkId);
+          }
 
           var content = this._content;
           var closeSkipLinkId = this._getSubId('closeSkipLink');
@@ -2286,8 +2296,10 @@ define(['ojs/ojpopupcore', 'ojs/ojcore-base', 'jquery', 'ojs/ojcontext', 'ojs/oj
        */
       _destroyVoiceOverAssist: function () {
         var liveRegion = this._liveRegion;
-        liveRegion.destroy();
-        delete this._liveRegion;
+        if (liveRegion) {
+          liveRegion.destroy();
+          delete this._liveRegion;
+        }
 
         var focusSkipLink = this._focusSkipLink;
         if (focusSkipLink) {

package/dist/js/libs/oj/debug/ojpopupcore.js

@@ -1495,9 +1495,9 @@ define(['exports', 'ojs/ojcore-base', 'jquery', 'ojs/ojcomponentcore', 'ojs/ojlo
 
     ZOrderUtils.preOrderVisit(layer, ZOrderUtils._closeDescendantPopupsCallback);
 
+    ZOrderUtils._removeOverlayFromAncestorLayer(layer);
     ZOrderUtils._resetAriaHiddenOnBackround(layer);
     ZOrderUtils._restoreBodyOverflow();
-    ZOrderUtils._removeOverlayFromAncestorLayer(layer);
 
     layer.removeData(ZOrderUtils._EVENTS_DATA);
     layer.removeData(ZOrderUtils._MODALITY_DATA);
@@ -1551,8 +1551,11 @@ define(['exports', 'ojs/ojcore-base', 'jquery', 'ojs/ojcomponentcore', 'ojs/ojlo
   };
 
   ZOrderUtils._restoreBodyOverflow = function () {
-    const body = document.body;
-    body.classList.remove('oj-component-modal-open');
+    // if there are no more modals left, enable scrolling on body
+    if (!ZOrderUtils.hasModalDialogOpen()) {
+      const body = document.body;
+      body.classList.remove('oj-component-modal-open');
+    }
   };
 
   ZOrderUtils._removeFocusWithinFromOverlayedContent = function () {
@@ -3406,6 +3409,11 @@ define(['exports', 'ojs/ojcore-base', 'jquery', 'ojs/ojcomponentcore', 'ojs/ojlo
           }
         });
 
+        // JET-56620: normalize position left/top to integer values to avoid unnecessary
+        // repositioning caused by potential floating number oscillations
+        position.left = Math.round(position.left);
+        position.top = Math.round(position.top);
+
         if (options.using) {
           // Adds feedback as second argument to using callback, if present
           using = function (props) {

package/dist/js/libs/oj/debug/ojselectbase.js

@@ -919,6 +919,7 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
     this._isValueItemForPlaceholderFunc = options.isValueItemForPlaceholderFunc;
 
     this._currentFirstItem = null;
+    this._firstResultForKeyboardFocus = null;
     this._templateEngine = null;
     this._resultsCount = null;
     this._NO_RESULTS_FOUND_CLASSNAME = 'oj-listbox-searchselect-no-results';
@@ -1336,11 +1337,9 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
     this._SetCurrentFirstItem(null);
 
     // JET-38215 - SELECT SINGLE - KEYBOARD NAVIGATION FOR COLLECTION TEMPLATE USAGE
-    // remove an existing focusin listener before deciding whether we need to add a new one
-    if (this._focusinListener) {
-      this._containerElem[0].removeEventListener('focusin', this._focusinListener);
-      this._focusListener = null;
-    }
+    // Original logic updated for JET-49906 - IN ACCESSIBILITY MODE, THE FIRST DROPDOWN VALUE IS READ TWICE
+    // remove the existing first result for keyboard focus
+    this._firstResultForKeyboardFocus = null;
 
     // This method is called only after the collection fetched the data
     // get the result count and store them
@@ -1826,11 +1825,9 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
     this._ClearSelection();
 
     // JET-38215 - SELECT SINGLE - KEYBOARD NAVIGATION FOR COLLECTION TEMPLATE USAGE
-    // remove the focusin listener now that we don't need it anymore
-    if (this._focusinListener) {
-      this._containerElem[0].removeEventListener('focusin', this._focusinListener);
-      this._focusListener = null;
-    }
+    // Original logic updated for JET-49906 - IN ACCESSIBILITY MODE, THE FIRST DROPDOWN VALUE IS READ TWICE
+    // remove the first result as we do not need it anymore
+    this._firstResultForKeyboardFocus = null;
 
     /** @type {!Object.<oj.PopupService.OPTION, ?>} */
     var psOptions = {};
@@ -2217,6 +2214,26 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
     return this._resultsCount;
   };
 
+  /**
+   * Focuses the collection component.
+   *
+   * @return {Promise} A promise indicating that focus has been set on the collection component
+   *
+   * @memberof LovDropdown
+   * @instance
+   * @public
+   * @ignore
+   */
+  LovDropdown.prototype.focus = function () {
+    const resolveBusyState = this._addBusyStateFunc('LovDropdown focusing the collection component');
+    return this._handleCollectionFocus().then(
+      function () {
+        FocusUtils.focusFirstTabStop(this.getElement());
+        resolveBusyState();
+      }.bind(this)
+    );
+  };
+
   /**
    * Sets the current first value item
    *
@@ -2254,6 +2271,7 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
   };
 
   // JET-38215 - SELECT SINGLE - KEYBOARD NAVIGATION FOR COLLECTION TEMPLATE USAGE
+  // Original logic updated for JET-49906 - IN ACCESSIBILITY MODE, THE FIRST DROPDOWN VALUE IS READ TWICE
   /**
    * Fetches the first result from the data provider and sets it as the current row if the
    * collection gets keyboard focus.
@@ -2266,13 +2284,13 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
    */
   LovDropdown.prototype._FetchFirstResultForKeyboardFocus = function () {
     var busyContext = Context.getContext(this._containerElem[0]).getBusyContext();
+    this._firstResultForKeyboardFocus = null;
     return this._FetchFirstResult().then(
       function (data) {
         if (data != null) {
-          // if there are results, listen on focusin in order to set the first result as current so that
-          // the table header doesn't get focus
-          this._focusinListener = this._handleCollectionFocusinOnce.bind(this, data);
-          this._containerElem[0].addEventListener('focusin', this._focusinListener);
+          // if there are results, save the data so that it can be used for setting the
+          // current row when we need to focus the collection element.
+          this._firstResultForKeyboardFocus = data;
         }
         return busyContext.whenReady();
       }.bind(this)
@@ -2280,36 +2298,41 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
   };
 
   // JET-38215 - SELECT SINGLE - KEYBOARD NAVIGATION FOR COLLECTION TEMPLATE USAGE
+  // Original logic updated for JET-49906 - IN ACCESSIBILITY MODE, THE FIRST DROPDOWN VALUE IS READ TWICE
   /**
-   * Handle focusin on the collection in order to set the first result as the current row when
-   * the collection receives focus via the keyboard.
+   * Setup collection component before focusing it. This sets the first result as the current row when
+   * the LovDropdown.focus is called.
    *
    * @memberof LovDropdown
    * @instance
    * @private
    */
-  LovDropdown.prototype._handleCollectionFocusinOnce = function (data) {
-    this._containerElem[0].removeEventListener('focusin', this._focusinListener);
-    this._focusinListener = null;
-    // only focus the first row if focus was transferred via the keyboard
-    if (!DomUtils.recentPointer()) {
-      var resolveBusyState = this._addBusyStateFunc('LovDropdown setting selected KeySet on focusin');
+  LovDropdown.prototype._handleCollectionFocus = function () {
+    var resolveBusyState = this._addBusyStateFunc('LovDropdown setting selected KeySet on focusin');
+
+    // ignore if we do not have first row data
+    if (!this._firstResultForKeyboardFocus) {
+      // Return a Promise to be consistent with the else path. Make sure to set and resolve the busy context.
+      return Promise.resolve().then(function () {
+        resolveBusyState();
+      });
+    }
 
-      // JET-39993 - Select2 options qunit tests fail using chrome and safari on Mac for master branch
-      // set flag while we're setting the collection current row and selected key set because we don't
-      // need to react to changes that we're pushing
-      this._handlingCollectionFocusinOnce = true;
+    // JET-39993 - Select2 options qunit tests fail using chrome and safari on Mac for master branch
+    // set flag while we're setting the collection current row and selected key set because we don't
+    // need to react to changes that we're pushing
+    this._handlingCollectionFocusinOnce = true;
 
-      this._SetCollectionCurrentRow({ rowKey: data.key });
+    this._SetCollectionCurrentRow({ rowKey: this._firstResultForKeyboardFocus.key });
 
-      var busyContext = Context.getContext(this._containerElem[0]).getBusyContext();
-      busyContext.whenReady().then(
-        function () {
-          this._handlingCollectionFocusinOnce = false;
-          resolveBusyState();
-        }.bind(this)
-      );
-    }
+    var busyContext = Context.getContext(this._containerElem[0]).getBusyContext();
+    return busyContext.whenReady().then(
+      function () {
+        this._handlingCollectionFocusinOnce = false;
+        this._firstResultForKeyboardFocus = null;
+        resolveBusyState();
+      }.bind(this)
+    );
   };
 
   /**
@@ -3764,17 +3787,23 @@ define(['exports', 'ojs/ojeditablevalue', 'ojs/ojpopupcore', 'ojs/ojinputtext',
 
       var abstractLovBase = this._abstractLovBase;
       var lovDropdown = this._lovDropdown;
+      var outerWrapper = this.OuterWrapper;
 
       switch (keyCode) {
         case LovUtils.KEYS.UP:
         case LovUtils.KEYS.DOWN:
           if (abstractLovBase.isDropdownOpen()) {
             // lovDropdown.transferHighlight((keyCode === LovUtils.KEYS.UP) ? -1 : 1);
-            FocusUtils.focusFirstTabStop(lovDropdown.getElement());
-
-            // keep oj-focus on root so that inside label is still shifted up and field looks focused
-            // while dropdown is open
-            this.OuterWrapper.classList.add('oj-focus');
+            lovDropdown.focus().then(function () {
+              // keep oj-focus on root so that inside label is still shifted up and field looks focused
+              // while dropdown is open.
+              // And since we are dealing with asynchronism here, make sure if the focus is still in the
+              // dropdown.
+              const dropdownElement = lovDropdown.getElement();
+              if (dropdownElement && dropdownElement.contains(document.activeElement)) {
+                outerWrapper.classList.add('oj-focus');
+              }
+            });
 
             // if tabbing into dropdown, continue showing filter field as it was before tabbing
             //  - ie11: filter field hidden when you arrow into dropdown