diff --git a/devtools/client/styleeditor/test/browser.ini b/devtools/client/styleeditor/test/browser.ini
index ebf37177ca77..f4afbe0a8e79 100644
--- a/devtools/client/styleeditor/test/browser.ini
+++ b/devtools/client/styleeditor/test/browser.ini
@@ -64,6 +64,8 @@ support-files =
doc_short_string.css
doc_xulpage.xhtml
sync.html
+ sync_with_csp.css
+ sync_with_csp.html
utf-16.css
!/devtools/client/inspector/shared/test/head.js
!/devtools/client/inspector/test/head.js
diff --git a/devtools/client/styleeditor/test/browser_styleeditor_syncAddProperty.js b/devtools/client/styleeditor/test/browser_styleeditor_syncAddProperty.js
index 4848a8564288..99df9b064c6b 100644
--- a/devtools/client/styleeditor/test/browser_styleeditor_syncAddProperty.js
+++ b/devtools/client/styleeditor/test/browser_styleeditor_syncAddProperty.js
@@ -5,6 +5,7 @@
// Test that adding a new rule is synced to the style editor.
const TESTCASE_URI = TEST_BASE_HTTP + "sync.html";
+const TESTCASE_URI_WITH_CSP = TEST_BASE_HTTP + "sync_with_csp.html";
const expectedText = `
body {
@@ -19,29 +20,33 @@ const expectedText = `
`;
add_task(async function() {
- await addTab(TESTCASE_URI);
- const { inspector, view } = await openRuleView();
- await selectNode("#testid", inspector);
+ const URIs = [TESTCASE_URI, TESTCASE_URI_WITH_CSP];
- info("Focusing a new property name in the rule-view");
- const ruleEditor = getRuleViewRuleEditor(view, 1);
- const editor = await focusEditableField(view, ruleEditor.closeBrace);
- is(
- inplaceEditor(ruleEditor.newPropSpan),
- editor,
- "The new property editor has focus"
- );
+ for (const URI of URIs) {
+ await addTab(URI);
+ const { inspector, view } = await openRuleView();
+ await selectNode("#testid", inspector);
- const input = editor.input;
- input.value = "/* background-color: yellow; */";
+ info("Focusing a new property name in the rule-view on " + URI);
+ const ruleEditor = getRuleViewRuleEditor(view, 1);
+ const editor = await focusEditableField(view, ruleEditor.closeBrace);
+ is(
+ inplaceEditor(ruleEditor.newPropSpan),
+ editor,
+ "The new property editor has focus"
+ );
- info("Pressing return to commit and focus the new value field");
- const onModifications = view.once("ruleview-changed");
- EventUtils.synthesizeKey("VK_RETURN", {}, view.styleWindow);
- await onModifications;
+ const input = editor.input;
+ input.value = "/* background-color: yellow; */";
- const { ui } = await openStyleEditor();
- const sourceEditor = await ui.editors[0].getSourceEditor();
- const text = sourceEditor.sourceEditor.getText();
- is(text, expectedText, "selector edits are synced");
+ info("Pressing return to commit and focus the new value field");
+ const onModifications = view.once("ruleview-changed");
+ EventUtils.synthesizeKey("VK_RETURN", {}, view.styleWindow);
+ await onModifications;
+
+ const { ui } = await openStyleEditor();
+ const sourceEditor = await ui.editors[0].getSourceEditor();
+ const text = sourceEditor.sourceEditor.getText();
+ is(text, expectedText, "selector edits are synced");
+ }
});
diff --git a/devtools/client/styleeditor/test/sync_with_csp.css b/devtools/client/styleeditor/test/sync_with_csp.css
new file mode 100644
index 000000000000..18f1b896828e
--- /dev/null
+++ b/devtools/client/styleeditor/test/sync_with_csp.css
@@ -0,0 +1,10 @@
+
+ body {
+ border-width: 15px;
+ color: red;
+ }
+
+ #testid {
+ font-size: 4em;
+ }
+
\ No newline at end of file
diff --git a/devtools/client/styleeditor/test/sync_with_csp.html b/devtools/client/styleeditor/test/sync_with_csp.html
new file mode 100644
index 000000000000..cdab014f59cf
--- /dev/null
+++ b/devtools/client/styleeditor/test/sync_with_csp.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ simple testcase with content security policy
+
+
+
+ simple testcase with content security policy
+
+