зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1408708 - Fetch stylesheet content via stylesheet window instead of top level content window. r=pbro
MozReview-Commit-ID: AKXQLNAwy8t
This commit is contained in:
Родитель
c25dc801cd
Коммит
02e1065367
|
@ -4,8 +4,11 @@ subsuite = devtools
|
|||
support-files =
|
||||
autocomplete.html
|
||||
browser_styleeditor_cmd_edit.html
|
||||
bug_1405342_serviceworker_iframes.html
|
||||
four.html
|
||||
head.js
|
||||
iframe_with_service_worker.html
|
||||
iframe_service_worker.js
|
||||
import.css
|
||||
import.html
|
||||
import2.css
|
||||
|
@ -70,6 +73,7 @@ support-files =
|
|||
[browser_styleeditor_bug_740541_iframes.js]
|
||||
[browser_styleeditor_bug_851132_middle_click.js]
|
||||
[browser_styleeditor_bug_870339.js]
|
||||
[browser_styleeditor_bug_1405342_serviceworker_iframes.js]
|
||||
[browser_styleeditor_cmd_edit.js]
|
||||
[browser_styleeditor_enabled.js]
|
||||
[browser_styleeditor_fetch-from-cache.js]
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
/* Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/ */
|
||||
"use strict";
|
||||
|
||||
// Test that sheets inside cross origin iframes, served from a service worker
|
||||
// are correctly fetched via the service worker in the stylesheet editor.
|
||||
|
||||
add_task(async function () {
|
||||
const TEST_URL = "https://test1.example.com/browser/devtools/client/styleeditor/test/bug_1405342_serviceworker_iframes.html";
|
||||
let { ui } = await openStyleEditorForURL(TEST_URL);
|
||||
|
||||
if (ui.editors.length != 1) {
|
||||
info("Stylesheet isn't available immediately, waiting for it");
|
||||
await ui.once("editor-added");
|
||||
}
|
||||
is(ui.editors.length, 1, "Got the iframe stylesheet");
|
||||
|
||||
await ui.selectStyleSheet(ui.editors[0].styleSheet);
|
||||
let editor = await ui.editors[0].getSourceEditor();
|
||||
let text = editor.sourceEditor.getText();
|
||||
is(text, "* { color: green; }",
|
||||
"stylesheet content is the one served by the service worker");
|
||||
});
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Bug 1405342</title>
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="https://test2.example.com/browser/devtools/client/styleeditor/test/iframe_with_service_worker.html"><iframe>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,12 @@
|
|||
"use strict";
|
||||
|
||||
self.onfetch = function (event) {
|
||||
if (event.request.url.includes("sheet.css")) {
|
||||
return event.respondWith(new Response("* { color: green; }"));
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
self.onactivate = function (event) {
|
||||
event.waitUntil(self.clients.claim());
|
||||
};
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
|
||||
Iframe loading a stylesheet via a service worker
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
function waitForActive(swr) {
|
||||
let sw = swr.installing || swr.waiting || swr.active;
|
||||
return new Promise(resolve => {
|
||||
if (sw.state === "activated") {
|
||||
resolve(swr);
|
||||
return;
|
||||
}
|
||||
sw.addEventListener("statechange", function onStateChange(evt) {
|
||||
if (sw.state === "activated") {
|
||||
sw.removeEventListener("statechange", onStateChange);
|
||||
resolve(swr);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
navigator.serviceWorker.register("iframe_service_worker.js", {scope: "."})
|
||||
.then(registration => waitForActive(registration))
|
||||
.then(() => {
|
||||
let link = document.createElement("link");
|
||||
link.setAttribute("rel", "stylesheet");
|
||||
link.setAttribute("type", "text/css");
|
||||
link.setAttribute("href", "sheet.css");
|
||||
document.documentElement.appendChild(link);
|
||||
});
|
||||
</script>
|
|
@ -140,7 +140,7 @@ var StyleSheetActor = protocol.ActorClassWithSpec(styleSheetSpec, {
|
|||
* Window of target
|
||||
*/
|
||||
get window() {
|
||||
return this._window || this.parentActor.window;
|
||||
return this.parentActor.window;
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -150,6 +150,14 @@ var StyleSheetActor = protocol.ActorClassWithSpec(styleSheetSpec, {
|
|||
return this.window.document;
|
||||
},
|
||||
|
||||
/**
|
||||
* StyleSheet's window.
|
||||
*/
|
||||
get ownerWindow() {
|
||||
// eslint-disable-next-line mozilla/use-ownerGlobal
|
||||
return this.ownerDocument.defaultView;
|
||||
},
|
||||
|
||||
get ownerNode() {
|
||||
return this.rawSheet.ownerNode;
|
||||
},
|
||||
|
@ -202,18 +210,31 @@ var StyleSheetActor = protocol.ActorClassWithSpec(styleSheetSpec, {
|
|||
}
|
||||
},
|
||||
|
||||
initialize: function (styleSheet, parentActor, window) {
|
||||
initialize: function (styleSheet, parentActor) {
|
||||
protocol.Actor.prototype.initialize.call(this, null);
|
||||
|
||||
this.rawSheet = styleSheet;
|
||||
this.parentActor = parentActor;
|
||||
this.conn = this.parentActor.conn;
|
||||
|
||||
this._window = window;
|
||||
|
||||
// text and index are unknown until source load
|
||||
this.text = null;
|
||||
this._styleSheetIndex = -1;
|
||||
|
||||
// When the style is imported, `styleSheet.ownerNode` is null,
|
||||
// so retrieve the topmost parent style sheet which has an ownerNode
|
||||
let parentStyleSheet = styleSheet;
|
||||
while (parentStyleSheet.parentStyleSheet) {
|
||||
parentStyleSheet = parentStyleSheet.parentStyleSheet;
|
||||
}
|
||||
// When the style is injected via nsIDOMWindowUtils.loadSheet, even
|
||||
// the parent style sheet has no owner, so default back to tab actor
|
||||
// document
|
||||
if (parentStyleSheet.ownerNode) {
|
||||
this.ownerDocument = parentStyleSheet.ownerNode.ownerDocument;
|
||||
} else {
|
||||
this.ownerDocument = parentActor.window;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -417,8 +438,8 @@ var StyleSheetActor = protocol.ActorClassWithSpec(styleSheetSpec, {
|
|||
let excludedProtocolsRe = /^(chrome|file|resource|moz-extension):\/\//;
|
||||
if (!excludedProtocolsRe.test(this.href)) {
|
||||
// Stylesheets using other protocols should use the content principal.
|
||||
options.window = this.window;
|
||||
options.principal = this.document.nodePrincipal;
|
||||
options.window = this.ownerWindow;
|
||||
options.principal = this.ownerDocument.nodePrincipal;
|
||||
}
|
||||
|
||||
let result;
|
||||
|
|
|
@ -589,7 +589,18 @@ function mainThreadFetch(urlIn, aOptions = { loadFromCache: true,
|
|||
// the input unmodified. Essentially we try to decode the data as UTF-8
|
||||
// and if that fails, we use the locale specific default encoding. This is
|
||||
// the best we can do if the source does not provide charset info.
|
||||
let charset = bomCharset || channel.contentCharset || aOptions.charset || "UTF-8";
|
||||
let charset = bomCharset;
|
||||
if (!charset) {
|
||||
try {
|
||||
charset = channel.contentCharset;
|
||||
} catch (e) {
|
||||
// Accessing `contentCharset` on content served by a service worker in
|
||||
// non-e10s may throw.
|
||||
}
|
||||
}
|
||||
if (!charset) {
|
||||
charset = aOptions.charset || "UTF-8";
|
||||
}
|
||||
let unicodeSource = NetworkHelper.convertToUnicode(source, charset);
|
||||
|
||||
deferred.resolve({
|
||||
|
|
Загрузка…
Ссылка в новой задаче