Skip to content

Drop isInteractive and hasDOM from the renderer -- declaring we only support "browser-like" environments with the current renderer #21348

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
NullVoxPopuli wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Drop isInteractive and hasDOM from the renderer -- declaring we only support "browser-like" environments with the current renderer #21348

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion lib/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@ const shim = addonV1Shim(path.join(__dirname, '..'), {
return {
...meta,
'implicit-modules': [
'./dist/dev/packages/@ember/-internals/browser-environment/index.js',
'./dist/dev/packages/@ember/-internals/container/index.js',
'./dist/dev/packages/@ember/-internals/deprecations/index.js',
'./dist/dev/packages/@ember/-internals/environment/index.js',
Expand Down
1 change: 0 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,6 @@
"type": "addon",
"version": 2,
"renamed-modules": {
"@ember/-internals/browser-environment/index.js": "ember-source/@ember/-internals/browser-environment/index.js",
"@ember/-internals/container/index.js": "ember-source/@ember/-internals/container/index.js",
"@ember/-internals/deprecations/index.js": "ember-source/@ember/-internals/deprecations/index.js",
"@ember/-internals/environment/index.js": "ember-source/@ember/-internals/environment/index.js",
Expand Down
12 changes: 0 additions & 12 deletions packages/@ember/-internals/browser-environment/index.ts
View file
Open in desktop

This file was deleted.

19 changes: 0 additions & 19 deletions packages/@ember/-internals/browser-environment/lib/has-dom.ts
View file
Open in desktop

This file was deleted.

53 changes: 19 additions & 34 deletions packages/@ember/-internals/glimmer/lib/component-managers/curly.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -251,7 +251,7 @@ export default class CurlyComponentManager
owner: Owner,
ComponentClass: ComponentFactory,
args: VMArguments,
{ isInteractive }: Environment,
_env: Environment,
dynamicScope: DynamicScope,
callerSelfRef: Reference
): ComponentStateBucket {
Expand Down Expand Up @@ -313,15 +313,9 @@ export default class CurlyComponentManager

// We usually do this in the `didCreateElement`, but that hook doesn't fire for tagless components
if (!hasWrappedElement) {
if (isInteractive) {
component.trigger('willRender');
}

component.trigger('willRender');
component._transitionTo('hasElement');

if (isInteractive) {
component.trigger('willInsertElement');
}
component.trigger('willInsertElement');
}

// Track additional lifecycle metadata about this component in a state bucket.
Expand All @@ -331,8 +325,7 @@ export default class CurlyComponentManager
capturedArgs,
argsTag,
finalizer,
hasWrappedElement,
isInteractive
hasWrappedElement
);

if (args.named.has('class')) {
Expand All @@ -343,7 +336,7 @@ export default class CurlyComponentManager
processComponentInitializationAssertions(component, props);
}

if (isInteractive && hasWrappedElement) {
if (hasWrappedElement) {
component.trigger('willRender');
}

Expand All @@ -367,7 +360,7 @@ export default class CurlyComponentManager
}

didCreateElement(
{ component, classRef, isInteractive, rootRef }: ComponentStateBucket,
{ component, classRef, rootRef }: ComponentStateBucket,
element: Element,
operations: ElementOperations
): void {
Expand Down Expand Up @@ -407,28 +400,24 @@ export default class CurlyComponentManager

component._transitionTo('hasElement');

if (isInteractive) {
beginUntrackFrame();
component.trigger('willInsertElement');
endUntrackFrame();
}
beginUntrackFrame();
component.trigger('willInsertElement');
endUntrackFrame();
}

didRenderLayout(bucket: ComponentStateBucket, bounds: Bounds): void {
bucket.component[BOUNDS] = bounds;
bucket.finalize();
}

didCreate({ component, isInteractive }: ComponentStateBucket): void {
if (isInteractive) {
component._transitionTo('inDOM');
component.trigger('didInsertElement');
component.trigger('didRender');
}
didCreate({ component }: ComponentStateBucket): void {
component._transitionTo('inDOM');
component.trigger('didInsertElement');
component.trigger('didRender');
}

update(bucket: ComponentStateBucket): void {
let { component, args, argsTag, argsRevision, isInteractive } = bucket;
let { component, args, argsTag, argsRevision } = bucket;

bucket.finalizer = _instrumentStart('render.component', rerenderInstrumentDetails, component);

Expand All @@ -449,10 +438,8 @@ export default class CurlyComponentManager
component.trigger('didReceiveAttrs');
}

if (isInteractive) {
component.trigger('willUpdate');
component.trigger('willRender');
}
component.trigger('willUpdate');
component.trigger('willRender');

endUntrackFrame();

Expand All @@ -464,11 +451,9 @@ export default class CurlyComponentManager
bucket.finalize();
}

didUpdate({ component, isInteractive }: ComponentStateBucket): void {
if (isInteractive) {
component.trigger('didUpdate');
component.trigger('didRender');
}
didUpdate({ component }: ComponentStateBucket): void {
component.trigger('didUpdate');
component.trigger('didRender');
}

getDestroyable(bucket: ComponentStateBucket): Nullable<Destroyable> {
Expand Down
15 changes: 4 additions & 11 deletions packages/@ember/-internals/glimmer/lib/component-managers/root.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ class RootComponentManager extends CurlyComponentManager {
_owner: Owner,
_state: unknown,
_args: Nullable<VMArguments>,
{ isInteractive }: Environment,
_env: Environment,
dynamicScope: DynamicScope
) {
let component = this.component;
Expand All @@ -46,15 +46,9 @@ class RootComponentManager extends CurlyComponentManager {

// We usually do this in the `didCreateElement`, but that hook doesn't fire for tagless components
if (!hasWrappedElement) {
if (isInteractive) {
component.trigger('willRender');
}

component.trigger('willRender');
component._transitionTo('hasElement');

if (isInteractive) {
component.trigger('willInsertElement');
}
component.trigger('willInsertElement');
}

if (DEBUG) {
Expand All @@ -66,8 +60,7 @@ class RootComponentManager extends CurlyComponentManager {
null,
CONSTANT_TAG,
finalizer,
hasWrappedElement,
isInteractive
hasWrappedElement
);

consumeTag(component[DIRTY_TAG]);
Expand Down
86 changes: 25 additions & 61 deletions packages/@ember/-internals/glimmer/lib/component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import {
import { guidFor } from '@ember/-internals/utils';
import { assert } from '@ember/debug';
import { DEBUG } from '@glimmer/env';
import type { Environment, Template, TemplateFactory } from '@glimmer/interfaces';
import type { Template, TemplateFactory } from '@glimmer/interfaces';
import { setInternalComponentManager } from '@glimmer/manager';
import { isUpdatableRef, updateRef } from '@glimmer/reference';
import { normalizeProperty } from '@glimmer/runtime';
Expand All @@ -34,27 +34,14 @@ import {
IS_DISPATCHING_ATTRS,
getComponentCapturedArgs,
} from './component-managers/curly';
import { hasDOM } from '@ember/-internals/browser-environment';

// Keep track of which component classes have already been processed for lazy event setup.
let lazyEventsProcessed = new WeakMap<EventDispatcher, WeakSet<object>>();

const EMPTY_ARRAY = Object.freeze([]);

/**
Determines if the element matches the specified selector.

@private
@method matches
@param {DOMElement} el
@param {String} selector
*/
const elMatches: typeof Element.prototype.matches | undefined =
typeof Element !== 'undefined' ? Element.prototype.matches : undefined;

function matches(el: Element, selector: string): boolean {
assert('cannot call `matches` in fastboot mode', elMatches !== undefined);
return elMatches.call(el, selector);
return Element.prototype.matches.call(el, selector);
}

/**
Expand Down Expand Up @@ -939,7 +926,7 @@ class Component<S = unknown>
}
}

if (DEBUG && eventDispatcher && this.renderer._isInteractive && this.tagName === '') {
if (DEBUG && eventDispatcher && this.tagName === '') {
let eventNames = [];
let events = eventDispatcher.finalEventNameMapping;

Expand Down Expand Up @@ -997,17 +984,9 @@ class Component<S = unknown>
let owner = getOwner(this);
assert('Component is unexpectedly missing an owner', owner);

if ((owner.lookup('-environment:main') as Environment)!.isInteractive) {
let dispatcher = owner.lookup('event_dispatcher:main');
assert(
'Expected dispatcher to be an EventDispatcher',
dispatcher instanceof EventDispatcher
);
this.__dispatcher = dispatcher;
} else {
// In FastBoot we have no EventDispatcher. Set to null to not try again to look it up.
this.__dispatcher = null;
}
let dispatcher = owner.lookup('event_dispatcher:main');
assert('Expected dispatcher to be an EventDispatcher', dispatcher instanceof EventDispatcher);
this.__dispatcher = dispatcher;
}

return this.__dispatcher;
Expand Down Expand Up @@ -1445,45 +1424,30 @@ class Component<S = unknown>
@private
*/
appendTo(selector: string | Element | SimpleElement) {
let target;

if (hasDOM) {
assert(
`Expected a selector or instance of Element`,
typeof selector === 'string' || selector instanceof Element
);
assert(
`Expected a selector or instance of Element`,
typeof selector === 'string' || selector instanceof Element
);

target = typeof selector === 'string' ? document.querySelector(selector) : selector;
let target = typeof selector === 'string' ? document.querySelector(selector) : selector;

assert(`You tried to append to (${selector}) but that isn't in the DOM`, target);
assert('You cannot append to an existing Ember.View.', !matches(target, '.ember-view'));
assert(
'You cannot append to an existing Ember.View.',
(() => {
let node = target.parentNode;
while (node instanceof Element) {
if (matches(node, '.ember-view')) {
return false;
}

node = node.parentNode;
assert(`You tried to append to (${selector}) but that isn't in the DOM`, target);
assert('You cannot append to an existing Ember.View.', !matches(target, '.ember-view'));
assert(
'You cannot append to an existing Ember.View.',
(() => {
let node = target.parentNode;
while (node instanceof Element) {
if (matches(node, '.ember-view')) {
return false;
}

return true;
})()
);
} else {
target = selector;
node = node.parentNode;
}

assert(
`You tried to append to a selector string (${selector}) in an environment without a DOM`,
typeof target !== 'string'
);
assert(
`You tried to append to a non-Element (${selector}) in an environment without a DOM`,
typeof target.appendChild === 'function'
);
}
return true;
})()
);

// SAFETY: SimpleElement is supposed to be a subset of Element so this _should_ be safe.
// However, the types are more specific in some places which necessitates the `as`.
Expand Down
Loading
Loading