Re-enable onFocusOnly option for interaction defaults

src/ol/Map.js

@@ -64,7 +64,9 @@ class Map extends PluggableMap {
       options.controls = defaultControls();
     }
     if (!options.interactions) {
-      options.interactions = defaultInteractions();
+      options.interactions = defaultInteractions({
+        onFocusOnly: true,
+      });
     }
 
     super(options);

src/ol/events/condition.js

@@ -59,6 +59,18 @@ export const focus = function (event) {
   return event.target.getTargetElement().contains(document.activeElement);
 };
 
+/**
+ * Return `true` if the map has the focus or no 'tabindex' attribute set.
+ *
+ * @param {import("../MapBrowserEvent.js").default} event Map browser event.
+ * @return {boolean} The map container has the focus or no 'tabindex' attribute.
+ */
+export const focusWithTabindex = function (event) {
+  return event.map.getTargetElement().hasAttribute('tabindex')
+    ? focus(event)
+    : true;
+};
+
 /**
  * Return always true.
  *

src/ol/interaction.js

@@ -12,7 +12,7 @@ import Kinetic from './Kinetic.js';
 import MouseWheelZoom from './interaction/MouseWheelZoom.js';
 import PinchRotate from './interaction/PinchRotate.js';
 import PinchZoom from './interaction/PinchZoom.js';
-import {focus} from './events/condition.js';
+import {focusWithTabindex} from './events/condition.js';
 
 export {default as DoubleClickZoom} from './interaction/DoubleClickZoom.js';
 export {default as DragAndDrop} from './interaction/DragAndDrop.js';
@@ -112,7 +112,7 @@ export function defaults(opt_options) {
   if (dragPan) {
     interactions.push(
       new DragPan({
-        condition: options.onFocusOnly ? focus : undefined,
+        condition: options.onFocusOnly ? focusWithTabindex : undefined,
         kinetic: kinetic,
       })
     );
@@ -149,7 +149,7 @@ export function defaults(opt_options) {
   if (mouseWheelZoom) {
     interactions.push(
       new MouseWheelZoom({
-        condition: options.onFocusOnly ? focus : undefined,
+        condition: options.onFocusOnly ? focusWithTabindex : undefined,
         duration: options.zoomDuration,
       })
     );

src/ol/interaction/DragPan.js

@@ -6,7 +6,7 @@ import PointerInteraction, {
 } from './Pointer.js';
 import {FALSE} from '../functions.js';
 import {easeOut} from '../easing.js';
-import {focus, noModifierKeys, primaryAction} from '../events/condition.js';
+import {noModifierKeys, primaryAction} from '../events/condition.js';
 import {
   rotate as rotateCoordinate,
   scale as scaleCoordinate,
@@ -72,19 +72,6 @@ class DragPan extends PointerInteraction {
     this.noKinetic_ = false;
   }
 
-  /**
-   * @private
-   * @param {import("../MapBrowserEvent").default} mapBrowserEvent Event.
-   * @return {boolean} Condition passes.
-   */
-  conditionInternal_(mapBrowserEvent) {
-    let pass = true;
-    if (mapBrowserEvent.map.getTargetElement().hasAttribute('tabindex')) {
-      pass = focus(mapBrowserEvent);
-    }
-    return pass && this.condition_(mapBrowserEvent);
-  }
-
   /**
    * Handle pointer drag events.
    * @param {import("../MapBrowserEvent.js").default} mapBrowserEvent Event.
@@ -167,10 +154,7 @@ class DragPan extends PointerInteraction {
    * @return {boolean} If the event was consumed.
    */
   handleDownEvent(mapBrowserEvent) {
-    if (
+    if (this.targetPointers.length > 0 && this.condition_(mapBrowserEvent)) {
-      this.targetPointers.length > 0 &&
-      this.conditionInternal_(mapBrowserEvent)
-    ) {
       const map = mapBrowserEvent.map;
       const view = map.getView();
       this.lastCentroid = null;

src/ol/interaction/MouseWheelZoom.js

@@ -4,7 +4,7 @@
 import EventType from '../events/EventType.js';
 import Interaction, {zoomByDelta} from './Interaction.js';
 import {DEVICE_PIXEL_RATIO, FIREFOX} from '../has.js';
-import {always, focus} from '../events/condition.js';
+import {always} from '../events/condition.js';
 import {clamp} from '../math.js';
 
 /**
@@ -146,19 +146,6 @@ class MouseWheelZoom extends Interaction {
     this.deltaPerZoom_ = 300;
   }
 
-  /**
-   * @private
-   * @param {import("../MapBrowserEvent").default} mapBrowserEvent Event.
-   * @return {boolean} Condition passes.
-   */
-  conditionInternal_(mapBrowserEvent) {
-    let pass = true;
-    if (mapBrowserEvent.map.getTargetElement().hasAttribute('tabindex')) {
-      pass = focus(mapBrowserEvent);
-    }
-    return pass && this.condition_(mapBrowserEvent);
-  }
-
   /**
    * @private
    */
@@ -179,7 +166,7 @@ class MouseWheelZoom extends Interaction {
    * @return {boolean} `false` to stop event propagation.
    */
   handleEvent(mapBrowserEvent) {
-    if (!this.conditionInternal_(mapBrowserEvent)) {
+    if (!this.condition_(mapBrowserEvent)) {
       return true;
     }
     const type = mapBrowserEvent.type;

test/spec/ol/map.test.js

@@ -18,6 +18,7 @@ import VectorSource from '../../../src/ol/source/Vector.js';
 import View from '../../../src/ol/View.js';
 import XYZ from '../../../src/ol/source/XYZ.js';
 import {LineString, Point, Polygon} from '../../../src/ol/geom.js';
+import {TRUE} from '../../../src/ol/functions.js';
 import {
   clearUserProjection,
   fromLonLat,
@@ -26,7 +27,7 @@ import {
   useGeographic,
 } from '../../../src/ol/proj.js';
 import {defaults as defaultInteractions} from '../../../src/ol/interaction.js';
-import {focus} from '../../../src/ol/events/condition.js';
+import {focusWithTabindex} from '../../../src/ol/events/condition.js';
 
 describe('ol.Map', function () {
   describe('constructor', function () {
@@ -726,13 +727,13 @@ describe('ol.Map', function () {
         expect(interactions.item(0).useAnchor_).to.eql(true);
         interactions.item(0).setMouseAnchor(false);
         expect(interactions.item(0).useAnchor_).to.eql(false);
-        expect(interactions.item(0).condition_).to.not.be(focus);
+        expect(interactions.item(0).condition_).to.be(TRUE);
       });
       it('uses the focus condition when onFocusOnly option is set', function () {
         options.onFocusOnly = true;
         options.mouseWheelZoom = true;
         const interactions = defaultInteractions(options);
-        expect(interactions.item(0).condition_).to.be(focus);
+        expect(interactions.item(0).condition_).to.be(focusWithTabindex);
       });
     });
 
@@ -742,13 +743,13 @@ describe('ol.Map', function () {
         const interactions = defaultInteractions(options);
         expect(interactions.getLength()).to.eql(1);
         expect(interactions.item(0)).to.be.a(DragPan);
-        expect(interactions.item(0).condition_).to.not.be(focus);
+        expect(interactions.item(0).condition_).to.not.be(focusWithTabindex);
       });
       it('uses the focus condition when onFocusOnly option is set', function () {
         options.onFocusOnly = true;
         options.dragPan = true;
         const interactions = defaultInteractions(options);
-        expect(interactions.item(0).condition_).to.be(focus);
+        expect(interactions.item(0).condition_).to.be(focusWithTabindex);
       });
     });