diff --git a/js/input/EventContext.ts b/js/input/EventContext.ts index 8a058d857..b4a241083 100644 --- a/js/input/EventContext.ts +++ b/js/input/EventContext.ts @@ -27,10 +27,10 @@ export default class EventContext { } /** - * DOM (Scenery) nodes set dataset.noPreventDefault on their container if they don't want preventDefault to be called. - * We search up the tree to detect this. + * DOM (Scenery) nodes set dataset.sceneryAllowInput on their container if they don't want preventDefault to be called, + * or other effects that block input (e.g. setPointerCapture). We search up the tree to detect this. */ - public hasNoPreventDefault(): boolean { + public allowsDOMInput(): boolean { const target = this.domEvent?.target; @@ -39,7 +39,7 @@ export default class EventContext { while ( element ) { // For DOM nodes, we can check for a data attribute - if ( element instanceof HTMLElement && element.dataset?.noPreventDefault === 'true' ) { + if ( element instanceof HTMLElement && element.dataset?.sceneryAllowInput === 'true' ) { return true; } diff --git a/js/input/Input.ts b/js/input/Input.ts index a2c807ea3..837d38c9c 100644 --- a/js/input/Input.ts +++ b/js/input/Input.ts @@ -880,7 +880,7 @@ export default class Input extends PhetioObject { !( this.passiveEvents === true ) && ( callback !== this.mouseDown || platform.edge ) && batchType !== BatchedDOMEventType.ALT_TYPE && - !context.hasNoPreventDefault() + !context.allowsDOMInput() ) { // We cannot prevent a passive event, so don't try context.domEvent.preventDefault(); @@ -1386,7 +1386,7 @@ export default class Input extends PhetioObject { // this element (it will bubble). See https://github.com/phetsims/scenery/issues/464 and // http://news.qooxdoo.org/mouse-capturing. const target = this.attachToWindow ? document.body : this.display.domElement; - if ( target.setPointerCapture && context.domEvent.pointerId ) { + if ( target.setPointerCapture && context.domEvent.pointerId && !context.allowsDOMInput() ) { // NOTE: This will error out if run on a playback destination, where a pointer with the given ID does not exist. target.setPointerCapture( context.domEvent.pointerId ); } diff --git a/js/nodes/DOM.ts b/js/nodes/DOM.ts index 3024c1b38..d9b50b434 100644 --- a/js/nodes/DOM.ts +++ b/js/nodes/DOM.ts @@ -250,7 +250,7 @@ export default class DOM extends Node { public isInputAllowed(): boolean { return this._allowInput; } private invalidateAllowInput( allowInput: boolean ): void { - this._container.dataset.noPreventDefault = allowInput ? 'true' : 'false'; + this._container.dataset.sceneryAllowInput = allowInput ? 'true' : 'false'; this._container.style.pointerEvents = allowInput ? 'auto' : 'none'; } diff --git a/tests/sandbox.html b/tests/sandbox.html index a69868a95..f1a89668b 100644 --- a/tests/sandbox.html +++ b/tests/sandbox.html @@ -196,8 +196,7 @@ width: 1, height: 1, accessibility: true, - listenToOnlyElement: true, - allowCSSHacks: false + listenToOnlyElement: true } ); const isDescendant = function (parent, child) {