diff options
Diffstat (limited to 'devtools/client/inspector')
| -rw-r--r-- | devtools/client/inspector/rules/models/rule.js | 11 | ||||
| -rw-r--r-- | devtools/client/inspector/rules/test/browser_rules_style-editor-link.js | 35 |
2 files changed, 34 insertions, 12 deletions
diff --git a/devtools/client/inspector/rules/models/rule.js b/devtools/client/inspector/rules/models/rule.js index 1a3fa057a..4c978cb58 100644 --- a/devtools/client/inspector/rules/models/rule.js +++ b/devtools/client/inspector/rules/models/rule.js @@ -140,11 +140,18 @@ Rule.prototype = { line, mediaText}) => { let mediaString = mediaText ? " @" + mediaText : ""; let linePart = line > 0 ? (":" + line) : ""; + let decodedHref = href; + + if (decodedHref) { + try { + decodedHref = decodeURIComponent(href); + } catch (e) {} + } let sourceStrings = { - full: (href || CssLogic.l10n("rule.sourceInline")) + linePart + + full: (decodedHref || CssLogic.l10n("rule.sourceInline")) + linePart + mediaString, - short: CssLogic.shortSource({href: href}) + linePart + mediaString + short: CssLogic.shortSource({href: decodedHref}) + linePart + mediaString }; return sourceStrings; diff --git a/devtools/client/inspector/rules/test/browser_rules_style-editor-link.js b/devtools/client/inspector/rules/test/browser_rules_style-editor-link.js index 927deb8ce..6a4fd1d66 100644 --- a/devtools/client/inspector/rules/test/browser_rules_style-editor-link.js +++ b/devtools/client/inspector/rules/test/browser_rules_style-editor-link.js @@ -10,10 +10,12 @@ thisTestLeaksUncaughtRejectionsAndShouldBeFixed("Error: Unknown sheet source"); // Test the links from the rule-view to the styleeditor -const STYLESHEET_URL = "data:text/css," + encodeURIComponent( - ["#first {", - "color: blue", - "}"].join("\n")); +const STYLESHEET_DATA_URL_CONTENTS = ["#first {", + "color: blue", + "}"].join("\n"); +const STYLESHEET_DATA_URL = + `data:text/css,${encodeURIComponent(STYLESHEET_DATA_URL_CONTENTS)}`; +const STYLESHEET_DECODED_DATA_URL = `data:text/css,${STYLESHEET_DATA_URL_CONTENTS}`; const EXTERNAL_STYLESHEET_FILE_NAME = "doc_style_editor_link.css"; const EXTERNAL_STYLESHEET_URL = URL_ROOT + EXTERNAL_STYLESHEET_FILE_NAME; @@ -31,7 +33,7 @@ const DOCUMENT_URL = "data:text/html;charset=utf-8," + encodeURIComponent(` <style> div { font-weight: bold; } </style> - <link rel="stylesheet" type="text/css" href="${STYLESHEET_URL}"> + <link rel="stylesheet" type="text/css" href="${STYLESHEET_DATA_URL}"> <link rel="stylesheet" type="text/css" href="${EXTERNAL_STYLESHEET_URL}"> </head> <body> @@ -178,15 +180,28 @@ function* testDisabledStyleEditor(view, toolbox) { } function testRuleViewLinkLabel(view) { - let link = getRuleViewLinkByIndex(view, 2); + info("Checking the data URL link label"); + + let link = getRuleViewLinkByIndex(view, 1); let labelElem = link.querySelector(".ruleview-rule-source-label"); let value = labelElem.textContent; let tooltipText = labelElem.getAttribute("title"); - is(value, EXTERNAL_STYLESHEET_FILE_NAME + ":1", - "rule view stylesheet display value matches filename and line number"); - is(tooltipText, EXTERNAL_STYLESHEET_URL + ":1", - "rule view stylesheet tooltip text matches the full URI path"); + is(value, `${STYLESHEET_DATA_URL_CONTENTS}:1`, + "Rule view data URL stylesheet display value matches contents"); + is(tooltipText, `${STYLESHEET_DECODED_DATA_URL}:1`, + "Rule view data URL stylesheet tooltip text matches the full URI path"); + + info("Checking the external link label"); + link = getRuleViewLinkByIndex(view, 2); + labelElem = link.querySelector(".ruleview-rule-source-label"); + value = labelElem.textContent; + tooltipText = labelElem.getAttribute("title"); + + is(value, `${EXTERNAL_STYLESHEET_FILE_NAME}:1`, + "Rule view external stylesheet display value matches filename and line number"); + is(tooltipText, `${EXTERNAL_STYLESHEET_URL}:1`, + "Rule view external stylesheet tooltip text matches the full URI path"); } function testUnselectableRuleViewLink(view, index) { |