Bug 213984

Summary:

ServiceWorker.postMessage() doesn't work from inside iframe

Product:

WebKit

Reporter:

nkronlage

Component:

Service Workers

Assignee:

youenn fablet <youennf>

Status:

RESOLVED FIXED

Severity:

Normal

CC:

cdumez, esprehn+autocc, ews-watchlist, japhet, kangil.han, webkit-bug-importer, youennf

Priority:

Keywords:

InRadar

Version:

Safari Technology Preview

Hardware:

Unspecified

OS:

Unspecified

Attachments:

Description	Flags
Simplified repro	none
Patch	none
Patch	none
Patch	none
Patch	none
Patch	none
Patch for landing	none
Patch	none

Description nkronlage 2020-07-05 22:08:04 PDT

Created attachment 403573 [details]
Simplified repro

Sending messages via postMessage to a ServiceWorker does not work from inside an iframe.

To repro this, download the attached zip.
Serve the files locally.
Open from-iframe.html in Safari
Go to Develop->Service Workers->localhost
Go to Console and notice there are no 'postMessage received:' logs here.

If you open from-main-window.html, you will see the postMessage events.

This works correctly in FireFox. Chrome has a bug registering ServiceWorkers from iframes so it doesn't make it to the point of postMessage - https://bugs.chromium.org/p/chromium/issues/detail?id=1102209


from-iframe.html:
  <iframe></iframe>

  <script>
    const iframe = document.querySelector('iframe');
    iframe.contentDocument.write(`
      <body>
        <script>
          (async () => {
            document.body.insertAdjacentHTML('beforeend', 'registering service-worker.js<br>');
            const reg = await navigator.serviceWorker.register('/service-worker.js');
 
            const sw = reg.installing;
            sw.postMessage('after register');

            sw.onstatechange = () => {
              document.body.insertAdjacentHTML('beforeend', \`statechange to: \${sw.state}<br>\`);
              sw.postMessage('statechange to ' + sw.state);
            };
          })();
        </${'script'}>
      </body>`);
  </script>

service-worker.js:
  console.log('service worker loaded');

  addEventListener('message', event => {
    console.log('postMessage received:', event.data);
  });


from-main-window.html:
  <body>
  <script>
    (async () => {
      document.body.insertAdjacentHTML('beforeend', 'registering service-worker.js<br>');
      const reg = await navigator.serviceWorker.register('/service-worker.js');

      const sw = reg.installing;
      sw.postMessage('after register');

      sw.onstatechange = () => {
        document.body.insertAdjacentHTML('beforeend', `statechange to: ${sw.state}<br>`);
        sw.postMessage('statechange to ' + sw.state);
      };
    })();
  </script>
  </body>

Comment 1 Radar WebKit Bug Importer 2020-07-07 18:44:40 PDT

<rdar://problem/65203340>

Comment 2 youenn fablet 2020-08-05 07:43:14 PDT

Issue is that the iframe is not registered as a service worker client.

Comment 3 youenn fablet 2020-08-05 12:56:39 PDT

Created attachment 406027 [details]
Patch

Comment 4 youenn fablet 2022-04-14 00:33:46 PDT

Created attachment 457601 [details]
Patch

Comment 5 youenn fablet 2022-04-14 01:46:44 PDT

Created attachment 457603 [details]
Patch

Comment 6 youenn fablet 2022-04-14 02:33:32 PDT

Created attachment 457606 [details]
Patch

Comment 7 youenn fablet 2022-04-14 06:21:32 PDT

Created attachment 457618 [details]
Patch

Comment 8 Chris Dumez 2022-04-14 08:27:33 PDT

Comment on attachment 457618 [details]
Patch

r=me

Comment 9 youenn fablet 2022-04-15 00:43:41 PDT

The check to reduce service worker client registrations out of http/blob/about is not working with extension schemes. I'll remove it.

Comment 10 youenn fablet 2022-04-15 00:44:14 PDT

Created attachment 457681 [details]
Patch for landing

Comment 11 youenn fablet 2022-04-15 01:56:20 PDT

Created attachment 457685 [details]
Patch

Comment 12 EWS 2022-04-15 06:16:39 PDT

Committed r292905 (249675@main): <https://commits.webkit.org/249675@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 457685 [details].