Merge branch 'main' into pr/techfg/493

QwikDev · Mar 24, 2024 · eb9715d · eb9715d
2 parents 2390388 + 81b2f0d
commit eb9715d
Show file tree

Hide file tree

Showing 16 changed files with 388 additions and 180 deletions.
diff --git a/src/lib/main/snippet.ts b/src/lib/main/snippet.ts
@@ -79,6 +79,7 @@ export function snippet(
 
   function loadSandbox(isAtomics?: number) {
     sandbox = doc.createElement(isAtomics ? 'script' : 'iframe');
+    win._pttab = Date.now();
     if (!isAtomics) {
       sandbox.style.display = 'block';
       sandbox.style.width = '0';
@@ -90,7 +91,7 @@ export function snippet(
     sandbox.src =
       libPath +
       'partytown-' +
-      (isAtomics ? 'atomics.js?v=_VERSION_' : 'sandbox-sw.html?' + Date.now());
+      (isAtomics ? 'atomics.js?v=_VERSION_' : 'sandbox-sw.html?' + win._pttab);
 
     doc.querySelector(config!.sandboxParent || 'body')!.appendChild(sandbox);
   }

diff --git a/src/lib/sandbox/read-main-platform.ts b/src/lib/sandbox/read-main-platform.ts
@@ -62,6 +62,7 @@ export const readMainPlatform = () => {
     $interfaces$: readImplementations(impls, initialInterfaces),
     $libPath$: new URL(libPath, mainWindow.location as any) + '',
     $origin$: origin,
+    $tabId$: mainWindow._pttab,
   };
 
   addGlobalConstructorUsingPrototype(

diff --git a/src/lib/service-worker/fetch.ts b/src/lib/service-worker/fetch.ts
@@ -33,14 +33,24 @@ export const receiveMessageFromSandboxToServiceWorker = (ev: ExtendableMessageEv
   }
 };
 
-const sendMessageToSandboxFromServiceWorker = (accessReq: MainAccessRequest) =>
-  new Promise<MainAccessResponse>(async (resolve) => {
-    const clients = await (self as any as ServiceWorkerGlobalScope).clients.matchAll();
-    const client = [...clients].sort((a, b) => {
+const getClientByTab = (clients: Client[], msgId: string) => {
+  const tabId = msgId.split('.').pop();
+  let client = clients.find((a) => a.url.endsWith(`?${tabId}`));
+  if (!client) {
+    client = [...clients].sort((a, b) => {
       if (a.url > b.url) return -1;
       if (a.url < b.url) return 1;
       return 0;
     })[0];
+  }
+
+  return client;
+}
+
+const sendMessageToSandboxFromServiceWorker = (accessReq: MainAccessRequest) =>
+  new Promise<MainAccessResponse>(async (resolve) => {
+    const clients = await (self as any as ServiceWorkerGlobalScope).clients.matchAll();
+    const client = getClientByTab([...clients], accessReq.$msgId$);
 
     if (client) {
       const timeout = debug ? 120000 : 10000;

diff --git a/src/lib/types.ts b/src/lib/types.ts
@@ -128,6 +128,7 @@ export interface InitWebWorkerData {
   $libPath$: string;
   $sharedDataBuffer$?: SharedArrayBuffer;
   $origin$: string;
+  $tabId$?: number;
 }
 
 /**
@@ -166,6 +167,7 @@ export interface WebWorkerContext {
   $postMessage$: (msg: MessageFromWorkerToSandbox, arr?: any[]) => void;
   $sharedDataBuffer$?: SharedArrayBuffer;
   lastLog?: string;
+  $tabId$?: number;
 }
 
 export interface InitializeEnvironmentData {
@@ -622,6 +624,7 @@ export type StringIndexable = {
 export interface MainWindow extends Window, StringIndexable {
   partytown?: PartytownConfig;
   _ptf?: any[];
+  _pttab?: number;
 }
 
 export const enum NodeName {

diff --git a/src/lib/web-worker/init-web-worker.ts b/src/lib/web-worker/init-web-worker.ts
@@ -12,6 +12,7 @@ export const initWebWorker = (initWebWorkerData: InitWebWorkerData) => {
   webWorkerCtx.$origin$ = locOrigin;
   webWorkerCtx.$postMessage$ = (postMessage as any).bind(self);
   webWorkerCtx.$sharedDataBuffer$ = initWebWorkerData.$sharedDataBuffer$;
+  webWorkerCtx.$tabId$ = initWebWorkerData.$tabId$;
 
   (self as any).importScripts = undefined;
   delete (self as any).postMessage;

diff --git a/src/lib/web-worker/worker-constants.ts b/src/lib/web-worker/worker-constants.ts
@@ -60,7 +60,7 @@ export const structureChangingMethodNames = /*#__PURE__*/ commaSplit(
 
 /** setters that could change dimensions of elements */
 export const dimensionChangingSetterNames = /*#__PURE__*/ commaSplit(
-  'className,width,height,hidden,innerHTML,innerText,textContent'
+  'className,width,height,hidden,innerHTML,innerText,textContent,text'
 );
 
 /** method calls that could change dimensions of elements */

diff --git a/src/lib/web-worker/worker-proxy.ts b/src/lib/web-worker/worker-proxy.ts
@@ -107,7 +107,7 @@ export const sendToMain = (isBlocking?: boolean) => {
 
     const endTask = taskQueue[len(taskQueue) - 1];
     const accessReq: MainAccessRequest = {
-      $msgId$: randomId(),
+      $msgId$: `${randomId()}.${webWorkerCtx.$tabId$}`,
       $tasks$: [...taskQueue],
     };
     taskQueue.length = 0;

diff --git a/src/lib/web-worker/worker-script.ts b/src/lib/web-worker/worker-script.ts
@@ -36,6 +36,8 @@ export const patchHTMLScriptElement = (WorkerHTMLScriptElement: any, env: WebWor
       },
     },
 
+    text: innerHTMLDescriptor,
+
     textContent: innerHTMLDescriptor,
 
     type: {
@@ -59,11 +61,15 @@ export const patchHTMLScriptElement = (WorkerHTMLScriptElement: any, env: WebWor
 const innerHTMLDescriptor: PropertyDescriptor & ThisType<WorkerNode> = {
   get() {
     const type = getter(this, ['type']);
+
     if (isScriptJsType(type)) {
-      return getInstanceStateValue<string>(this, StateProp.innerHTML) || '';
-    } else {
-      return getter(this, ['innerHTML']);
+      const scriptContent = getInstanceStateValue<string>(this, StateProp.innerHTML);
+      if (scriptContent) {
+        return scriptContent;
+      }
     }
+
+    return getter(this, ['innerHTML']) || '';
   },
   set(scriptContent: string) {
     setInstanceStateValue(this, StateProp.innerHTML, scriptContent);