fix: update near-membrane-dom to use ShadowRealm, fallback to iframe

feat: my attempt

fix: ensure that globalObjectShape is used in both paths when provided

refactor: split logic for better readability

refactor: support linkage of window.__proto__ chain in shadow realm

chore: revert debug

fix: restore globalShapeObject and globalObjectVirtualizationTarget behavior in createShadowRealmVirtualEnvironment

Author: rwaldron

packages/near-membrane-base/src/environment.ts

@@ -44,23 +44,23 @@ export class VirtualEnvironment {
 
     private readonly blueGetSelectedTarget: GetSelectedTarget;
 
-    private readonly blueGetTransferableValue: GetTransferableValue;
+    private blueGetTransferableValue: GetTransferableValue;
 
-    private readonly blueGlobalThisPointer: Pointer;
+    private blueGlobalThisPointer: Pointer;
 
     private readonly redCallableEvaluate: CallableEvaluate;
 
     private readonly redCallableGetPropertyValuePointer: CallableGetPropertyValuePointer;
 
     private readonly redCallableLinkPointers: CallableLinkPointers;
 
-    private readonly redCallableSetPrototypeOf: CallableSetPrototypeOf;
+    private redCallableSetPrototypeOf: CallableSetPrototypeOf;
 
-    private readonly redCallableDefineProperties: CallableDefineProperties;
+    private redCallableDefineProperties: CallableDefineProperties;
 
-    private readonly redCallableInstallLazyPropertyDescriptors: CallableInstallLazyPropertyDescriptors;
+    private redCallableInstallLazyPropertyDescriptors: CallableInstallLazyPropertyDescriptors;
 
-    private readonly redGlobalThisPointer: Pointer;
+    private redGlobalThisPointer: Pointer;
 
     constructor(options: VirtualEnvironmentOptions) {
         if (options === undefined) {

packages/near-membrane-base/src/intrinsics.ts

@@ -5,6 +5,9 @@ import { PropertyKeys } from './types';
 const { assign: ObjectAssign } = Object;
 const { ownKeys: ReflectOwnKeys } = Reflect;
 
+// @ts-ignore: Prevent cannot find name 'ShadowRealm' error.
+export const SUPPORTS_SHADOW_REALM = typeof ShadowRealm === 'function';
+
 /**
  * This list must be in sync with ecma-262, anything new added to the global object
  * should be considered, to decide whether or not they need remapping. The default

packages/near-membrane-dom/src/browser-realm.ts

@@ -1,6 +1,7 @@
 import {
     assignFilteredGlobalDescriptorsFromPropertyDescriptorMap,
     Connector,
+    CallableEvaluate,
     createBlueConnector,
     createRedConnector,
     DistortionCallback,
@@ -10,6 +11,7 @@ import {
     linkIntrinsics,
     PropertyKeys,
     toSafeWeakMap,
+    SUPPORTS_SHADOW_REALM,
     VirtualEnvironment,
 } from '@locker/near-membrane-base';
 
@@ -34,10 +36,15 @@ const ObjectCtor = Object;
 const TypeErrorCtor = TypeError;
 const WeakMapCtor = WeakMap;
 const { prototype: DocumentProto } = Document;
+const { bind: FunctionProtoBind } = Function.prototype;
 const { prototype: NodeProto } = Node;
 const { remove: ElementProtoRemove, setAttribute: ElementProtoSetAttribute } = Element.prototype;
 const { appendChild: NodeProtoAppendChild } = NodeProto;
-const { assign: ObjectAssign } = ObjectCtor;
+const {
+    assign: ObjectAssign,
+    create: ObjectCreate,
+    getOwnPropertyDescriptors: ObjectGetOwnPropertyDescriptors,
+} = ObjectCtor;
 // eslint-disable-next-line @typescript-eslint/naming-convention
 const { __lookupGetter__: ObjectProtoLookupGetter } = ObjectCtor.prototype as any;
 const { apply: ReflectApply } = Reflect;
@@ -66,8 +73,13 @@ const NodeProtoLastChildGetter: Getter = ReflectApply(ObjectProtoLookupGetter, N
 const blueDocumentToBlueCreateHooksCallbackMap = toSafeWeakMap(
     new WeakMapCtor<Document, Connector>()
 );
+// @ts-ignore: Prevent cannot find name 'ShadowRealm' error.
+const ShadowRealmCtor = SUPPORTS_SHADOW_REALM ? ShadowRealm : undefined;
+const ShadowRealmProtoEvaluate: CallableEvaluate | undefined = ShadowRealmCtor?.prototype?.evaluate;
+const defaultGlobalOwnKeysRegistry = { __proto__: null };
 
 let defaultGlobalOwnKeys: PropertyKeys | null = null;
+let defaultGlobalPropertyDescriptorMap: PropertyDescriptorMap | null = null;
 
 function createDetachableIframe(doc: Document): HTMLIFrameElement {
     const iframe: HTMLIFrameElement = ReflectApply(DocumentProtoCreateElement, doc, ['iframe']);
@@ -90,7 +102,7 @@ function createIframeVirtualEnvironment(
     if (typeof globalObject !== 'object' || globalObject === null) {
         throw new TypeErrorCtor('Missing global object virtualization target.');
     }
-    const blueRefs = getCachedGlobalObjectReferences(globalObject);
+    const blueRefs = getCachedGlobalObjectReferences(globalObject)!;
     if (typeof blueRefs !== 'object' || blueRefs === null) {
         throw new TypeErrorCtor('Invalid virtualization target.');
     }
@@ -180,4 +192,103 @@ function createIframeVirtualEnvironment(
     return env;
 }
 
-export default createIframeVirtualEnvironment;
+function createShadowRealmVirtualEnvironment(
+    globalObject: WindowProxy & typeof globalThis,
+    globalObjectShape: object | null,
+    providedOptions?: BrowserEnvironmentOptions
+): VirtualEnvironment {
+    if (typeof globalObject !== 'object' || globalObject === null) {
+        throw new TypeErrorCtor('Missing global object virtualization target.');
+    }
+    const {
+        distortionCallback,
+        endowments,
+        instrumentation,
+        // eslint-disable-next-line prefer-object-spread
+    } = ObjectAssign({ __proto__: null }, providedOptions);
+
+    // If a globalObjectShape has been explicitly specified, reset the
+    // defaultGlobalPropertyDescriptorMap to null. This will ensure that
+    // the provided globalObjectShape is used to re-create the cached
+    // defaultGlobalPropertyDescriptorMap.
+    if (globalObjectShape !== null) {
+        defaultGlobalPropertyDescriptorMap = null;
+    }
+    if (defaultGlobalPropertyDescriptorMap === null) {
+        let sourceShapeOrOneTimeWindow = globalObjectShape!;
+        let sourceIsIframe = false;
+        if (globalObjectShape === null) {
+            const oneTimeIframe = createDetachableIframe(globalObject.document);
+            sourceShapeOrOneTimeWindow = ReflectApply(
+                HTMLIFrameElementProtoContentWindowGetter,
+                oneTimeIframe,
+                []
+            )!;
+            sourceIsIframe = true;
+        }
+        defaultGlobalOwnKeys = getFilteredGlobalOwnKeys(sourceShapeOrOneTimeWindow);
+        if (sourceIsIframe) {
+            ReflectApply(ElementProtoRemove, sourceShapeOrOneTimeWindow, []);
+        }
+        defaultGlobalPropertyDescriptorMap = {
+            __proto__: null,
+        } as unknown as PropertyDescriptorMap;
+        assignFilteredGlobalDescriptorsFromPropertyDescriptorMap(
+            defaultGlobalPropertyDescriptorMap,
+            ObjectGetOwnPropertyDescriptors(globalObject)
+        );
+        for (let i = 0, { length } = defaultGlobalOwnKeys; i < length; i += 1) {
+            defaultGlobalOwnKeysRegistry[defaultGlobalOwnKeys[i]] = true;
+        }
+        for (const key in defaultGlobalPropertyDescriptorMap) {
+            if (!(key in defaultGlobalOwnKeysRegistry)) {
+                delete defaultGlobalPropertyDescriptorMap[key];
+            }
+        }
+    }
+    const blueRefs = getCachedGlobalObjectReferences(globalObject)!;
+    // Create a new environment.
+    const env = new VirtualEnvironment({
+        blueConnector: createBlueConnector(globalObject),
+        distortionCallback,
+        instrumentation,
+        redConnector: createRedConnector(
+            ReflectApply(FunctionProtoBind, ShadowRealmProtoEvaluate, [new ShadowRealmCtor()])
+        ),
+    });
+    linkIntrinsics(env, globalObject);
+    // window
+    env.link('globalThis');
+    // Set globalThis.__proto__ in the sandbox to a proxy of
+    // globalObject.__proto__ and with this, the entire
+    // structure around window proto chain should be covered.
+    env.remapProto(globalObject, blueRefs.WindowProto);
+    let unsafeBlueDescMap: PropertyDescriptorMap = defaultGlobalPropertyDescriptorMap;
+    if (globalObject !== window) {
+        unsafeBlueDescMap = { __proto__: null } as unknown as PropertyDescriptorMap;
+        assignFilteredGlobalDescriptorsFromPropertyDescriptorMap(
+            unsafeBlueDescMap,
+            ObjectGetOwnPropertyDescriptors(globalObject)
+        );
+        for (const key in unsafeBlueDescMap) {
+            if (!(key in defaultGlobalOwnKeysRegistry)) {
+                delete unsafeBlueDescMap[key];
+            }
+        }
+    }
+    env.remapProperties(blueRefs.window, unsafeBlueDescMap);
+    if (endowments) {
+        const filteredEndowments: PropertyDescriptorMap = {};
+        assignFilteredGlobalDescriptorsFromPropertyDescriptorMap(filteredEndowments, endowments);
+        removeWindowDescriptors(filteredEndowments);
+        env.remapProperties(blueRefs.window, filteredEndowments);
+    }
+    // We remap `blueRefs.WindowPropertiesProto` to an empty object because it
+    // is "magical" in that it provides access to elements by id.
+    env.remapProto(blueRefs.WindowProto, ObjectCreate(blueRefs.EventTargetProto));
+    return env;
+}
+
+export default SUPPORTS_SHADOW_REALM
+    ? createShadowRealmVirtualEnvironment
+    : createIframeVirtualEnvironment;

test/environment/createvirtualenvironment.spec.js

@@ -1,3 +1,4 @@
+import { SUPPORTS_SHADOW_REALM } from '@locker/near-membrane-base';
 import createVirtualEnvironment from '@locker/near-membrane-dom';
 
 describe('createVirtualEnvironment', () => {
@@ -37,8 +38,11 @@ describe('createVirtualEnvironment', () => {
             });
             it('options object has keepAlive: true', () => {
                 const count = window.frames.length;
-                const env = createVirtualEnvironment(window, { keepAlive: true });
-                expect(window.frames.length).toBe(count + 1);
+                const env = createVirtualEnvironment(window, {
+                    globalObjectShape: window,
+                    keepAlive: true,
+                });
+                expect(window.frames.length).toBe(SUPPORTS_SHADOW_REALM ? count : count + 1);
                 expect(() => env.evaluate('')).not.toThrow();
             });
             it('options object has keepAlive: false', () => {