Skip to content
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.

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

Cannot intercept requests from dynamically-created frame , can anyone help ? #1006

Closed
hzzcc opened this issue Nov 25, 2021 · 5 comments
Closed
Labels
bug Something isn't working scope:browser Related to MSW running in a browser wontfix This will not be worked on

Comments

@hzzcc
Copy link

hzzcc commented Nov 25, 2021

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

@hzzcc hzzcc added the feature label Nov 25, 2021
@hzzcc
Copy link
Author

hzzcc commented Nov 25, 2021

The frame create like this

var iframe = document.createElement('iframe');
var html = '
<head><script src="/script.js"></script></head>
<body>Iframe</body>
';
document.body.appendChild(iframe);
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(html);

@kettanaito

@hzzcc
Copy link
Author

hzzcc commented Nov 25, 2021

I think this issue relative to w3c/ServiceWorker#765

@kettanaito
Copy link
Member

Hey, @hzzcc. What is your expected behavior? What request are we speaking about? Could you please provide more details?

@hzzcc
Copy link
Author

hzzcc commented Nov 26, 2021

Hey, @hzzcc. What is your expected behavior? What request are we speaking about? Could you please provide more details?

Here is the repo, run yarn start, you can see logs in devtool
https://github.com/hzzcc/msw_reproduce_example

@kettanaito
Copy link
Member

kettanaito commented Nov 26, 2021

Hey, @hzzcc. Thank you for putting together a reproduction repository.

Root cause

The issue itself is related to how sandboxed iframes inherit the service worker from the parental scope (see w3c/ServiceWorker#765 and w3c/ServiceWorker#1390). According to the W3C decision, such iframes must inherit the worker and be listed in its clients. That, however, doesn't happen.

This inheritance is required in order for the worker to know that it should control the nested iframe. Without it, the worker doesn't know that the iframe emits any requests and, thus, cannot catch them. That's why you don't get the GET /user request from the nested iframe mocked: the worker doesn't know anything about it.

This may be related to the browser not implementing this inheritance, like this Chromium bug.

Solution

There's nothing we can do on the library's side to facilitate this. The service worker behavior implementation is the browser's responsibility. We operate on the higher level, on the already implemented worker spec. Unfortunately, using the iframe scenario like yours isn't possible at the moment due to how browsers implement worker inheritance for such iframes.

You should be able to have request interception in iframes if you use the src attribute instead of srcDoc. We do have support for such a use case and it's tested to be functional at the moment.

<iframe title="frame" src="./frame.html"></iframe>

Requests from such nested iframe will be caught and mocked because the src iframes inherit the upper-level worker controller.

@kettanaito kettanaito added bug Something isn't working scope:browser Related to MSW running in a browser wontfix This will not be worked on and removed feature labels Nov 26, 2021
@github-actions github-actions bot locked and limited conversation to collaborators Nov 8, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Something isn't working scope:browser Related to MSW running in a browser wontfix This will not be worked on
Projects
None yet
Development

No branches or pull requests

2 participants