From 26a029d407be480d791972afb5975cf62c9360a6 Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Fri, 19 Apr 2024 02:47:55 +0200 Subject: Adding upstream version 124.0.1. Signed-off-by: Daniel Baumann --- .../browser_rules_large_base64_background_image.js | 73 ++++++++++++++++++++++ 1 file changed, 73 insertions(+) create mode 100644 devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js (limited to 'devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js') diff --git a/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js b/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js new file mode 100644 index 0000000000..0373d29321 --- /dev/null +++ b/devtools/client/inspector/rules/test/browser_rules_large_base64_background_image.js @@ -0,0 +1,73 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// 1px red dot +const shortDataUrl = + "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQIW2P4z8DwHwAFAAH/F1FwBgAAAABJRU5ErkJggg=="; + +// Not a valid base64 image, but will still generate a long text property +const longDataUrl = new Array(1000 * 1000).join("a"); + +const TEST_STYLESHEET = ` +body { + background-image: url(data:image/png;base64,${shortDataUrl}); + background-image: url(data:image/png;base64,${longDataUrl}); +}`; + +// Serve the stylesheet dynamically from a test HTTPServer to avoid logging an +// extremely long data-url when adding the tab using our usual test helpers. +const server = createTestHTTPServer(); +const filepath = "/style.css"; +const cssuri = `http://localhost:${server.identity.primaryPort}${filepath}`; +server.registerContentType("css", "text/css"); +server.registerPathHandler(filepath, (metadata, response) => { + response.write(TEST_STYLESHEET); +}); + +const TEST_URL = + "data:text/html," + + encodeURIComponent(` + + + + + + + +`); + +// Check that long URLs are rendered correctly in the rule view. +add_task(async function () { + const { inspector } = await openInspectorForURL(TEST_URL); + const view = selectRuleView(inspector); + + await selectNode("body", inspector); + + const propertyValues = view.styleDocument.querySelectorAll( + ".ruleview-propertyvalue" + ); + + is(propertyValues.length, 2, "Ruleview has 2 propertyvalue elements"); + ok( + propertyValues[0].textContent.startsWith("url(data:image/png"), + "Property value for the background image was correctly rendered" + ); + + ok( + !propertyValues[0].querySelector(".propertyvalue-long-text"), + "The first background-image is short enough and does not need to be truncated" + ); + ok( + !!propertyValues[1].querySelector(".propertyvalue-long-text"), + "The second background-image has a special CSS class to be truncated" + ); + const ruleviewContainer = + view.styleDocument.getElementById("ruleview-container"); + Assert.strictEqual( + ruleviewContainer.scrollHeight, + ruleviewContainer.clientHeight, + "The ruleview container does not have a scrollbar" + ); +}); -- cgit v1.2.3