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 --- .../chrome/Debugger.Source.prototype.element-2.js | 4 + .../chrome/Debugger.Source.prototype.element.html | 25 ++ .../chrome/Debugger.Source.prototype.element.js | 7 + devtools/server/tests/chrome/chrome.toml | 150 +++++++++ ...ebugger.Source.prototype.introductionType.xhtml | 7 + devtools/server/tests/chrome/hello-actor.js | 28 ++ .../chrome/iframe1_makeGlobalObjectReference.html | 1 + .../chrome/iframe2_makeGlobalObjectReference.html | 1 + .../inactive-property-helper/align-content.mjs | 92 +++++ .../inactive-property-helper/border-image.mjs | 162 +++++++++ .../cue-pseudo-element.mjs | 371 +++++++++++++++++++++ .../first-letter-pseudo-element.mjs | 32 ++ .../first-line-pseudo-element.mjs | 50 +++ .../flex-grid-item-properties.mjs | 229 +++++++++++++ .../chrome/inactive-property-helper/float.mjs | 76 +++++ .../tests/chrome/inactive-property-helper/gap.mjs | 133 ++++++++ .../grid-container-properties.mjs | 43 +++ .../grid-with-absolute-properties.mjs | 71 ++++ .../highlight-pseudo-elements.mjs | 155 +++++++++ .../inactive-property-helper/margin-padding.mjs | 260 +++++++++++++++ .../max-min-width-height.mjs | 366 ++++++++++++++++++++ .../multicol-container-properties.mjs | 39 +++ .../place-items-content.mjs | 159 +++++++++ .../placeholder-pseudo-element.mjs | 122 +++++++ .../chrome/inactive-property-helper/positioned.mjs | 82 +++++ .../inactive-property-helper/scroll-padding.mjs | 159 +++++++++ .../chrome/inactive-property-helper/table-cell.mjs | 21 ++ .../chrome/inactive-property-helper/table.mjs | 28 ++ .../inactive-property-helper/text-overflow.mjs | 92 +++++ .../chrome/inactive-property-helper/text-wrap.mjs | 86 +++++ .../inactive-property-helper/vertical-align.mjs | 56 ++++ .../inactive-property-helper/width-height-ruby.mjs | 147 ++++++++ .../chrome/inspector-delay-image-response.sjs | 46 +++ .../server/tests/chrome/inspector-eyedropper.html | 20 ++ devtools/server/tests/chrome/inspector-helpers.js | 133 ++++++++ .../server/tests/chrome/inspector-search-data.html | 54 +++ .../server/tests/chrome/inspector-styles-data.css | 3 + .../server/tests/chrome/inspector-styles-data.html | 85 +++++ .../server/tests/chrome/inspector-template.html | 17 + .../tests/chrome/inspector-traversal-data.html | 103 ++++++ .../tests/chrome/inspector_css-properties.html | 12 + .../tests/chrome/inspector_display-type.html | 17 + .../tests/chrome/inspector_getImageData.html | 23 ++ .../tests/chrome/inspector_getOffsetParent.html | 18 + devtools/server/tests/chrome/large-image.jpg | Bin 0 -> 793541 bytes devtools/server/tests/chrome/memory-helpers.js | 72 ++++ .../tests/chrome/nonchrome_unsafeDereference.html | 10 + devtools/server/tests/chrome/small-image.gif | Bin 0 -> 510655 bytes .../tests/chrome/suspendTimeouts_content.html | 1 + .../server/tests/chrome/suspendTimeouts_content.js | 75 +++++ .../server/tests/chrome/suspendTimeouts_worker.js | 12 + .../test_Debugger.Script.prototype.global.html | 48 +++ ...Debugger.Source.prototype.elementAttribute.html | 159 +++++++++ ...bugger.Source.prototype.introductionScript.html | 96 ++++++ ...Debugger.Source.prototype.introductionType.html | 159 +++++++++ .../tests/chrome/test_animation-type-longhand.html | 42 +++ .../tests/chrome/test_css-logic-specificity.html | 84 +++++ devtools/server/tests/chrome/test_css-logic.html | 73 ++++ .../server/tests/chrome/test_css-properties.html | 72 ++++ devtools/server/tests/chrome/test_device.html | 79 +++++ .../test_executeInGlobal-outerized_this.html | 73 ++++ .../chrome/test_highlighter_paused_debugger.html | 88 +++++ .../tests/chrome/test_inspector-changeattrs.html | 90 +++++ .../tests/chrome/test_inspector-changevalue.html | 68 ++++ .../tests/chrome/test_inspector-display-type.html | 81 +++++ .../chrome/test_inspector-duplicate-node.html | 61 ++++ .../server/tests/chrome/test_inspector-hide.html | 71 ++++ .../test_inspector-inactive-property-helper.html | 124 +++++++ .../chrome/test_inspector-mutations-attr.html | 169 ++++++++++ .../chrome/test_inspector-mutations-events.html | 187 +++++++++++ .../chrome/test_inspector-mutations-value.html | 163 +++++++++ .../tests/chrome/test_inspector-pick-color.html | 94 ++++++ .../chrome/test_inspector-pseudoclass-lock.html | 185 ++++++++++ .../server/tests/chrome/test_inspector-reload.html | 90 +++++ .../server/tests/chrome/test_inspector-resize.html | 69 ++++ .../tests/chrome/test_inspector-resolve-url.html | 87 +++++ .../chrome/test_inspector-scroll-into-view.html | 60 ++++ .../tests/chrome/test_inspector-search-front.html | 163 +++++++++ .../tests/chrome/test_inspector-template.html | 66 ++++ .../test_inspector_getImageData-wait-for-load.html | 133 ++++++++ .../tests/chrome/test_inspector_getImageData.html | 142 ++++++++ .../chrome/test_inspector_getImageDataFromURL.html | 116 +++++++ .../chrome/test_inspector_getNodeFromActor.html | 84 +++++ .../chrome/test_inspector_getOffsetParent.html | 129 +++++++ .../chrome/test_makeGlobalObjectReference.html | 96 ++++++ devtools/server/tests/chrome/test_memory.html | 39 +++ .../tests/chrome/test_memory_allocations_02.html | 80 +++++ .../tests/chrome/test_memory_allocations_03.html | 80 +++++ .../tests/chrome/test_memory_allocations_04.html | 62 ++++ .../tests/chrome/test_memory_allocations_05.html | 93 ++++++ .../tests/chrome/test_memory_allocations_06.html | 51 +++ .../tests/chrome/test_memory_allocations_07.html | 58 ++++ .../server/tests/chrome/test_memory_attach_01.html | 33 ++ .../server/tests/chrome/test_memory_attach_02.html | 44 +++ .../server/tests/chrome/test_memory_census.html | 35 ++ .../server/tests/chrome/test_memory_gc_01.html | 50 +++ .../server/tests/chrome/test_memory_gc_events.html | 44 +++ .../server/tests/chrome/test_overflowing-body.html | 42 +++ .../tests/chrome/test_overflowing-children.html | 131 ++++++++ devtools/server/tests/chrome/test_preference.html | 128 +++++++ .../server/tests/chrome/test_styles-applied.html | 155 +++++++++ .../server/tests/chrome/test_styles-computed.html | 130 ++++++++ .../server/tests/chrome/test_styles-layout.html | 110 ++++++ .../server/tests/chrome/test_styles-matched.html | 110 ++++++ .../server/tests/chrome/test_styles-modify.html | 110 ++++++ devtools/server/tests/chrome/test_styles-svg.html | 61 ++++ .../server/tests/chrome/test_suspendTimeouts.html | 20 ++ .../server/tests/chrome/test_suspendTimeouts.js | 139 ++++++++ .../tests/chrome/test_unsafeDereference.html | 53 +++ .../tests/chrome/test_webconsole-node-grip.html | 66 ++++ devtools/server/tests/chrome/webconsole-helpers.js | 54 +++ 111 files changed, 9434 insertions(+) create mode 100644 devtools/server/tests/chrome/Debugger.Source.prototype.element-2.js create mode 100644 devtools/server/tests/chrome/Debugger.Source.prototype.element.html create mode 100644 devtools/server/tests/chrome/Debugger.Source.prototype.element.js create mode 100644 devtools/server/tests/chrome/chrome.toml create mode 100644 devtools/server/tests/chrome/doc_Debugger.Source.prototype.introductionType.xhtml create mode 100644 devtools/server/tests/chrome/hello-actor.js create mode 100644 devtools/server/tests/chrome/iframe1_makeGlobalObjectReference.html create mode 100644 devtools/server/tests/chrome/iframe2_makeGlobalObjectReference.html create mode 100644 devtools/server/tests/chrome/inactive-property-helper/align-content.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/border-image.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/cue-pseudo-element.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/first-letter-pseudo-element.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/first-line-pseudo-element.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/flex-grid-item-properties.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/float.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/gap.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/grid-container-properties.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/grid-with-absolute-properties.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/highlight-pseudo-elements.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/margin-padding.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/max-min-width-height.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/multicol-container-properties.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/place-items-content.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/placeholder-pseudo-element.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/positioned.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/scroll-padding.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/table-cell.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/table.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/text-overflow.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/text-wrap.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/vertical-align.mjs create mode 100644 devtools/server/tests/chrome/inactive-property-helper/width-height-ruby.mjs create mode 100644 devtools/server/tests/chrome/inspector-delay-image-response.sjs create mode 100644 devtools/server/tests/chrome/inspector-eyedropper.html create mode 100644 devtools/server/tests/chrome/inspector-helpers.js create mode 100644 devtools/server/tests/chrome/inspector-search-data.html create mode 100644 devtools/server/tests/chrome/inspector-styles-data.css create mode 100644 devtools/server/tests/chrome/inspector-styles-data.html create mode 100644 devtools/server/tests/chrome/inspector-template.html create mode 100644 devtools/server/tests/chrome/inspector-traversal-data.html create mode 100644 devtools/server/tests/chrome/inspector_css-properties.html create mode 100644 devtools/server/tests/chrome/inspector_display-type.html create mode 100644 devtools/server/tests/chrome/inspector_getImageData.html create mode 100644 devtools/server/tests/chrome/inspector_getOffsetParent.html create mode 100644 devtools/server/tests/chrome/large-image.jpg create mode 100644 devtools/server/tests/chrome/memory-helpers.js create mode 100644 devtools/server/tests/chrome/nonchrome_unsafeDereference.html create mode 100644 devtools/server/tests/chrome/small-image.gif create mode 100644 devtools/server/tests/chrome/suspendTimeouts_content.html create mode 100644 devtools/server/tests/chrome/suspendTimeouts_content.js create mode 100644 devtools/server/tests/chrome/suspendTimeouts_worker.js create mode 100644 devtools/server/tests/chrome/test_Debugger.Script.prototype.global.html create mode 100644 devtools/server/tests/chrome/test_Debugger.Source.prototype.elementAttribute.html create mode 100644 devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionScript.html create mode 100644 devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionType.html create mode 100644 devtools/server/tests/chrome/test_animation-type-longhand.html create mode 100644 devtools/server/tests/chrome/test_css-logic-specificity.html create mode 100644 devtools/server/tests/chrome/test_css-logic.html create mode 100644 devtools/server/tests/chrome/test_css-properties.html create mode 100644 devtools/server/tests/chrome/test_device.html create mode 100644 devtools/server/tests/chrome/test_executeInGlobal-outerized_this.html create mode 100644 devtools/server/tests/chrome/test_highlighter_paused_debugger.html create mode 100644 devtools/server/tests/chrome/test_inspector-changeattrs.html create mode 100644 devtools/server/tests/chrome/test_inspector-changevalue.html create mode 100644 devtools/server/tests/chrome/test_inspector-display-type.html create mode 100644 devtools/server/tests/chrome/test_inspector-duplicate-node.html create mode 100644 devtools/server/tests/chrome/test_inspector-hide.html create mode 100644 devtools/server/tests/chrome/test_inspector-inactive-property-helper.html create mode 100644 devtools/server/tests/chrome/test_inspector-mutations-attr.html create mode 100644 devtools/server/tests/chrome/test_inspector-mutations-events.html create mode 100644 devtools/server/tests/chrome/test_inspector-mutations-value.html create mode 100644 devtools/server/tests/chrome/test_inspector-pick-color.html create mode 100644 devtools/server/tests/chrome/test_inspector-pseudoclass-lock.html create mode 100644 devtools/server/tests/chrome/test_inspector-reload.html create mode 100644 devtools/server/tests/chrome/test_inspector-resize.html create mode 100644 devtools/server/tests/chrome/test_inspector-resolve-url.html create mode 100644 devtools/server/tests/chrome/test_inspector-scroll-into-view.html create mode 100644 devtools/server/tests/chrome/test_inspector-search-front.html create mode 100644 devtools/server/tests/chrome/test_inspector-template.html create mode 100644 devtools/server/tests/chrome/test_inspector_getImageData-wait-for-load.html create mode 100644 devtools/server/tests/chrome/test_inspector_getImageData.html create mode 100644 devtools/server/tests/chrome/test_inspector_getImageDataFromURL.html create mode 100644 devtools/server/tests/chrome/test_inspector_getNodeFromActor.html create mode 100644 devtools/server/tests/chrome/test_inspector_getOffsetParent.html create mode 100644 devtools/server/tests/chrome/test_makeGlobalObjectReference.html create mode 100644 devtools/server/tests/chrome/test_memory.html create mode 100644 devtools/server/tests/chrome/test_memory_allocations_02.html create mode 100644 devtools/server/tests/chrome/test_memory_allocations_03.html create mode 100644 devtools/server/tests/chrome/test_memory_allocations_04.html create mode 100644 devtools/server/tests/chrome/test_memory_allocations_05.html create mode 100644 devtools/server/tests/chrome/test_memory_allocations_06.html create mode 100644 devtools/server/tests/chrome/test_memory_allocations_07.html create mode 100644 devtools/server/tests/chrome/test_memory_attach_01.html create mode 100644 devtools/server/tests/chrome/test_memory_attach_02.html create mode 100644 devtools/server/tests/chrome/test_memory_census.html create mode 100644 devtools/server/tests/chrome/test_memory_gc_01.html create mode 100644 devtools/server/tests/chrome/test_memory_gc_events.html create mode 100644 devtools/server/tests/chrome/test_overflowing-body.html create mode 100644 devtools/server/tests/chrome/test_overflowing-children.html create mode 100644 devtools/server/tests/chrome/test_preference.html create mode 100644 devtools/server/tests/chrome/test_styles-applied.html create mode 100644 devtools/server/tests/chrome/test_styles-computed.html create mode 100644 devtools/server/tests/chrome/test_styles-layout.html create mode 100644 devtools/server/tests/chrome/test_styles-matched.html create mode 100644 devtools/server/tests/chrome/test_styles-modify.html create mode 100644 devtools/server/tests/chrome/test_styles-svg.html create mode 100644 devtools/server/tests/chrome/test_suspendTimeouts.html create mode 100644 devtools/server/tests/chrome/test_suspendTimeouts.js create mode 100644 devtools/server/tests/chrome/test_unsafeDereference.html create mode 100644 devtools/server/tests/chrome/test_webconsole-node-grip.html create mode 100644 devtools/server/tests/chrome/webconsole-helpers.js (limited to 'devtools/server/tests/chrome') diff --git a/devtools/server/tests/chrome/Debugger.Source.prototype.element-2.js b/devtools/server/tests/chrome/Debugger.Source.prototype.element-2.js new file mode 100644 index 0000000000..7260431428 --- /dev/null +++ b/devtools/server/tests/chrome/Debugger.Source.prototype.element-2.js @@ -0,0 +1,4 @@ +"use strict"; + +// eslint-disable-next-line no-debugger +debugger; diff --git a/devtools/server/tests/chrome/Debugger.Source.prototype.element.html b/devtools/server/tests/chrome/Debugger.Source.prototype.element.html new file mode 100644 index 0000000000..6959ad970d --- /dev/null +++ b/devtools/server/tests/chrome/Debugger.Source.prototype.element.html @@ -0,0 +1,25 @@ + + + + + + + + + + + +
Heidi
+ diff --git a/devtools/server/tests/chrome/Debugger.Source.prototype.element.js b/devtools/server/tests/chrome/Debugger.Source.prototype.element.js new file mode 100644 index 0000000000..095398ddad --- /dev/null +++ b/devtools/server/tests/chrome/Debugger.Source.prototype.element.js @@ -0,0 +1,7 @@ +/* exported heinrichFun */ +/* global franz */ +"use strict"; + +function heinrichFun() { + franz(); +} diff --git a/devtools/server/tests/chrome/chrome.toml b/devtools/server/tests/chrome/chrome.toml new file mode 100644 index 0000000000..b67b1ee971 --- /dev/null +++ b/devtools/server/tests/chrome/chrome.toml @@ -0,0 +1,150 @@ +[DEFAULT] +tags = "devtools" +skip-if = ["os == 'android'"] +support-files = [ + "doc_Debugger.Source.prototype.introductionType.xhtml", + "Debugger.Source.prototype.element.js", + "Debugger.Source.prototype.element-2.js", + "Debugger.Source.prototype.element.html", + "hello-actor.js", + "iframe1_makeGlobalObjectReference.html", + "iframe2_makeGlobalObjectReference.html", + "inspector_css-properties.html", + "inspector_display-type.html", + "inspector_getImageData.html", + "inspector_getOffsetParent.html", + "inspector-delay-image-response.sjs", + "inspector-eyedropper.html", + "inspector-helpers.js", + "inspector-search-data.html", + "inspector-styles-data.css", + "inspector-styles-data.html", + "inspector-template.html", + "inspector-traversal-data.html", + "large-image.jpg", + "memory-helpers.js", + "nonchrome_unsafeDereference.html", + "suspendTimeouts_content.html", + "suspendTimeouts_content.js", + "suspendTimeouts_worker.js", + "small-image.gif", + "test_suspendTimeouts.js", + "webconsole-helpers.js", + "inactive-property-helper/*.mjs", +] + +["test_Debugger.Script.prototype.global.html"] + +["test_Debugger.Source.prototype.elementAttribute.html"] + +["test_Debugger.Source.prototype.introductionScript.html"] + +["test_Debugger.Source.prototype.introductionType.html"] + +["test_animation-type-longhand.html"] + +["test_css-logic-specificity.html"] + +["test_css-logic.html"] + +["test_css-properties.html"] + +["test_device.html"] + +["test_executeInGlobal-outerized_this.html"] + +["test_highlighter_paused_debugger.html"] + +["test_inspector-changeattrs.html"] + +["test_inspector-changevalue.html"] + +["test_inspector-display-type.html"] + +["test_inspector-duplicate-node.html"] + +["test_inspector-hide.html"] + +["test_inspector-inactive-property-helper.html"] + +["test_inspector-mutations-attr.html"] + +["test_inspector-mutations-events.html"] + +["test_inspector-mutations-value.html"] + +["test_inspector-pick-color.html"] + +["test_inspector-pseudoclass-lock.html"] + +["test_inspector-reload.html"] + +["test_inspector-resize.html"] + +["test_inspector-resolve-url.html"] + +["test_inspector-scroll-into-view.html"] + +["test_inspector-search-front.html"] + +["test_inspector-template.html"] + +["test_inspector_getImageData-wait-for-load.html"] + +["test_inspector_getImageData.html"] + +["test_inspector_getImageDataFromURL.html"] + +["test_inspector_getNodeFromActor.html"] + +["test_inspector_getOffsetParent.html"] + +["test_makeGlobalObjectReference.html"] + +["test_memory.html"] + +["test_memory_allocations_02.html"] + +["test_memory_allocations_03.html"] + +["test_memory_allocations_04.html"] + +["test_memory_allocations_05.html"] + +["test_memory_allocations_06.html"] + +["test_memory_allocations_07.html"] + +["test_memory_attach_01.html"] + +["test_memory_attach_02.html"] + +["test_memory_census.html"] + +["test_memory_gc_01.html"] + +["test_memory_gc_events.html"] + +["test_overflowing-body.html"] + +["test_overflowing-children.html"] + +["test_preference.html"] + +["test_styles-applied.html"] + +["test_styles-computed.html"] + +["test_styles-layout.html"] + +["test_styles-matched.html"] + +["test_styles-modify.html"] + +["test_styles-svg.html"] + +["test_suspendTimeouts.html"] + +["test_unsafeDereference.html"] + +["test_webconsole-node-grip.html"] diff --git a/devtools/server/tests/chrome/doc_Debugger.Source.prototype.introductionType.xhtml b/devtools/server/tests/chrome/doc_Debugger.Source.prototype.introductionType.xhtml new file mode 100644 index 0000000000..b037190c9a --- /dev/null +++ b/devtools/server/tests/chrome/doc_Debugger.Source.prototype.introductionType.xhtml @@ -0,0 +1,7 @@ + + + + diff --git a/devtools/server/tests/chrome/hello-actor.js b/devtools/server/tests/chrome/hello-actor.js new file mode 100644 index 0000000000..eabb4a6773 --- /dev/null +++ b/devtools/server/tests/chrome/hello-actor.js @@ -0,0 +1,28 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ +/* exported HelloActor */ +"use strict"; + +const protocol = require("resource://devtools/shared/protocol.js"); + +const helloSpec = protocol.generateActorSpec({ + typeName: "helloActor", + + methods: { + count: { + request: {}, + response: { count: protocol.RetVal("number") }, + }, + }, +}); + +class HelloActor extends protocol.Actor { + constructor(conn) { + super(conn, helloSpec); + this.counter = 0; + } + + count() { + return ++this.counter; + } +} diff --git a/devtools/server/tests/chrome/iframe1_makeGlobalObjectReference.html b/devtools/server/tests/chrome/iframe1_makeGlobalObjectReference.html new file mode 100644 index 0000000000..bab5a70765 --- /dev/null +++ b/devtools/server/tests/chrome/iframe1_makeGlobalObjectReference.html @@ -0,0 +1 @@ +The word 'smorgasbord' spoken by an adorably plump child, symbolizing prosperity diff --git a/devtools/server/tests/chrome/iframe2_makeGlobalObjectReference.html b/devtools/server/tests/chrome/iframe2_makeGlobalObjectReference.html new file mode 100644 index 0000000000..b297ca8a2b --- /dev/null +++ b/devtools/server/tests/chrome/iframe2_makeGlobalObjectReference.html @@ -0,0 +1 @@ +Her retrospection, in hindsight, was prescient. diff --git a/devtools/server/tests/chrome/inactive-property-helper/align-content.mjs b/devtools/server/tests/chrome/inactive-property-helper/align-content.mjs new file mode 100644 index 0000000000..a871081fad --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/align-content.mjs @@ -0,0 +1,92 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `align-content` test cases. + +export default [ + { + info: "align-content is inactive on block elements (until bug 1105571 is fixed)", + property: "align-content", + tagName: "div", + rules: ["div { align-content: center; }"], + isActive: false, + }, + { + info: "align-content is active on flex containers", + property: "align-content", + tagName: "div", + rules: ["div { align-content: center; display: flex; }"], + isActive: true, + }, + { + info: "align-content is active on grid containers", + property: "align-content", + tagName: "div", + rules: ["div { align-content: center; display: grid; }"], + isActive: true, + }, + { + info: "align-content is inactive on flex items", + property: "align-content", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: flex; }", "span { align-content: center; }"], + ruleIndex: 1, + isActive: false, + }, + { + info: "align-content is inactive on grid items", + property: "align-content", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: grid; }", "span { align-content: center; }"], + ruleIndex: 1, + isActive: false, + }, + { + info: "align-content:baseline is active on flex items", + property: "align-content", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: flex; }", "span { align-content: baseline; }"], + ruleIndex: 1, + isActive: true, + }, + { + info: "align-content:baseline is active on grid items", + property: "align-content", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: grid; }", "span { align-content: baseline; }"], + ruleIndex: 1, + isActive: true, + }, + { + info: "align-content:baseline is active on table cells", + property: "align-content", + tagName: "div", + rules: ["div { display: table-cell; align-content: baseline; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/border-image.mjs b/devtools/server/tests/chrome/inactive-property-helper/border-image.mjs new file mode 100644 index 0000000000..85c57418a4 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/border-image.mjs @@ -0,0 +1,162 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `border-image` test cases. +export default [ + { + info: "border-image is active on another element then a table element or internal table element where border-collapse is not set to collapse", + property: "border-image", + tagName: "div", + rules: ["div { border-image: linear-gradient(red, yellow) 10; }"], + isActive: true, + }, + { + info: "border-image is active on another element then a table element or internal table element where border-collapse is set to collapse", + property: "border-image", + tagName: "div", + rules: [ + "div { border-image: linear-gradient(red, yellow) 10; border-collapse: collapse;}", + ], + isActive: true, + }, + { + info: "border-image is active on a td element with no table parent and the browser is not crashing", + property: "border-image", + tagName: "td", + rules: [ + "td { border-image: linear-gradient(red, yellow) 10; border-collapse: collapse;}", + ], + isActive: true, + }, + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: false, + borderCollapse: true, + borderCollapsePropertyIsInherited: false, + isActive: true, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: false, + borderCollapse: false, + borderCollapsePropertyIsInherited: false, + isActive: true, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: false, + borderCollapse: true, + borderCollapsePropertyIsInherited: true, + isActive: false, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: false, + borderCollapse: false, + borderCollapsePropertyIsInherited: true, + isActive: true, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: true, + borderCollapse: true, + borderCollapsePropertyIsInherited: false, + isActive: true, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: true, + borderCollapse: false, + borderCollapsePropertyIsInherited: false, + isActive: true, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: true, + borderCollapse: true, + borderCollapsePropertyIsInherited: true, + isActive: false, + }), + createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle: true, + borderCollapse: false, + borderCollapsePropertyIsInherited: true, + isActive: true, + }), +]; + +/** + * @param {Object} testParameters + * @param {bool} testParameters.useDivTagWithDisplayTableStyle use generic divs using display property instead of actual table/tr/td tags + * @param {bool} testParameters.borderCollapse is `border-collapse` property set to `collapse` ( instead of `separate`) + * @param {bool} testParameters.borderCollapsePropertyIsInherited should the border collapse property be inherited from the table parent (instead of directly set on the internal table element) + * @param {bool} testParameters.isActive is the border-image property actve on the element + * @returns + */ +function createTableElementsToTestBorderImage({ + useDivTagWithDisplayTableStyle, + borderCollapse, + borderCollapsePropertyIsInherited, + isActive, +}) { + return { + info: `border-image is ${ + isActive ? "active" : "inactive" + } on an internal table element where border-collapse is${ + borderCollapse ? "" : " not" + } set to collapse${ + borderCollapsePropertyIsInherited + ? " by being inherited from its table parent" + : "" + } when the table and its internal elements are ${ + useDivTagWithDisplayTableStyle ? "not " : "" + }using semantic tags (table, tr, td, ...)`, + property: "border-image", + createTestElement: rootNode => { + const table = useDivTagWithDisplayTableStyle + ? document.createElement("div") + : document.createElement("table"); + if (useDivTagWithDisplayTableStyle) { + table.style.display = "table"; + } + if (borderCollapsePropertyIsInherited) { + table.style.borderCollapse = `${ + borderCollapse ? "collapse" : "separate" + }`; + } + rootNode.appendChild(table); + + const tbody = useDivTagWithDisplayTableStyle + ? document.createElement("div") + : document.createElement("tbody"); + if (useDivTagWithDisplayTableStyle) { + tbody.style.display = "table-row-group"; + } + table.appendChild(tbody); + + const tr = useDivTagWithDisplayTableStyle + ? document.createElement("div") + : document.createElement("tr"); + if (useDivTagWithDisplayTableStyle) { + tr.style.display = "table-row"; + } + tbody.appendChild(tr); + + const td = useDivTagWithDisplayTableStyle + ? document.createElement("div") + : document.createElement("td"); + if (useDivTagWithDisplayTableStyle) { + td.style.display = "table-cell"; + td.classList.add("td"); + } + tr.appendChild(td); + + return td; + }, + rules: [ + `td, .td { + border-image: linear-gradient(red, yellow) 10; + ${ + !borderCollapsePropertyIsInherited + ? `border-collapse: ${borderCollapse ? "collapse" : "separate"};` + : "" + } + }`, + ], + isActive, + }; +} diff --git a/devtools/server/tests/chrome/inactive-property-helper/cue-pseudo-element.mjs b/devtools/server/tests/chrome/inactive-property-helper/cue-pseudo-element.mjs new file mode 100644 index 0000000000..7a55425632 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/cue-pseudo-element.mjs @@ -0,0 +1,371 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `cue-pseudo-element` test cases. + +// "background", +// "background-attachment", +// "background-blend-mode", +// "background-clip", +// "background-color", +// "background-image", +// "background-origin", +// "background-position", +// "background-position-x", +// "background-position-y", +// "background-repeat", +// "background-size", +// "color", +// "font", +// "font-family", +// "font-size", +// "font-stretch", +// "font-style", +// "font-variant", +// "font-variant-alternates", +// "font-variant-caps", +// "font-variant-east-asian", +// "font-variant-ligatures", +// "font-variant-numeric", +// "font-variant-position", +// "font-weight", +// "line-height", +// "opacity", +// "outline", +// "outline-color", +// "outline-offset", +// "outline-style", +// "outline-width", +// "ruby-position", +// "text-combine-upright", +// "text-decoration", +// "text-decoration-color", +// "text-decoration-line", +// "text-decoration-style", +// "text-decoration-thickness", +// "text-shadow", +// "visibility", +// "white-space", + +export default [ + { + info: "background is active on ::cue", + property: "background", + tagName: "video", + rules: ["video::cue { background: linear-gradient(white, black); }"], + isActive: true, + }, + { + info: "background-attachment is active on ::cue", + property: "background-attachment", + tagName: "video", + rules: ["video::cue { background-attachment: fixed; }"], + isActive: true, + }, + { + info: "background-blend-mode is active on ::cue", + property: "background-blend-mode", + tagName: "video", + rules: ["video::cue { background-blend-mode: difference; }"], + isActive: true, + }, + { + info: "background-clip is active on ::cue", + property: "background-clip", + tagName: "video", + rules: ["video::cue { background-clip: padding-box; }"], + isActive: true, + }, + { + info: "background-color is active on ::cue", + property: "background-color", + tagName: "video", + rules: ["video::cue { background-color: red; }"], + isActive: true, + }, + { + info: "background-image is active on ::cue", + property: "background-image", + tagName: "video", + rules: [ + "video::cue { background-image: url('https://example.com/image.png'); }", + ], + isActive: true, + }, + { + info: "background-origin is active on ::cue", + property: "background-origin", + tagName: "video", + rules: ["video::cue { background-origin: padding-box; }"], + isActive: true, + }, + { + info: "background-position is active on ::cue", + property: "background-position", + tagName: "video", + rules: ["video::cue { background-position: 0 0; }"], + isActive: true, + }, + { + info: "background-position-x is active on ::cue", + property: "background-position-x", + tagName: "video", + rules: ["video::cue { background-position-x: 0; }"], + isActive: true, + }, + { + info: "background-position-y is active on ::cue", + property: "background-position-y", + tagName: "video", + rules: ["video::cue { background-position-y: 0; }"], + isActive: true, + }, + { + info: "background-repeat is active on ::cue", + property: "background-repeat", + tagName: "video", + rules: ["video::cue { background-repeat: repeat-y; }"], + isActive: true, + }, + { + info: "background-size is active on ::cue", + property: "background-size", + tagName: "video", + rules: ["video::cue { background-size: 100% 100%; }"], + isActive: true, + }, + { + info: "color is active on ::cue", + property: "color", + tagName: "video", + rules: ["video::cue { color: red; }"], + isActive: true, + }, + { + info: "font is active on ::cue", + property: "font", + tagName: "video", + rules: ["video::cue { font: 1em sans-serif; }"], + isActive: true, + }, + { + info: "font-family is active on ::cue", + property: "font-family", + tagName: "video", + rules: ["video::cue { font-family: sans-serif; }"], + isActive: true, + }, + { + info: "font-size is active on ::cue", + property: "font-size", + tagName: "video", + rules: ["video::cue { font-size: 1em; }"], + isActive: true, + }, + { + info: "font-stretch is active on ::cue", + property: "font-stretch", + tagName: "video", + rules: ["video::cue { font-stretch: ultra-condensed; }"], + isActive: true, + }, + { + info: "font-style is active on ::cue", + property: "font-style", + tagName: "video", + rules: ["video::cue { font-style: italic; }"], + isActive: true, + }, + { + info: "font-variant is active on ::cue", + property: "font-variant", + tagName: "video", + rules: ["video::cue { font-variant: small-caps; }"], + isActive: true, + }, + { + info: "font-variant-alternates is active on ::cue", + property: "font-variant-alternates", + tagName: "video", + rules: ["video::cue { font-variant-alternates: slashed-zero; }"], + isActive: true, + }, + { + info: "font-variant-caps is active on ::cue", + property: "font-variant-caps", + tagName: "video", + rules: ["video::cue { font-variant-caps: all-small-caps; }"], + isActive: true, + }, + { + info: "font-variant-east-asian is active on ::cue", + property: "font-variant-east-asian", + tagName: "video", + rules: ["video::cue { font-variant-east-asian: ruby; }"], + isActive: true, + }, + { + info: "font-variant-ligatures is active on ::cue", + property: "font-variant-ligatures", + tagName: "video", + rules: ["video::cue { font-variant-ligatures: common-ligatures; }"], + isActive: true, + }, + { + info: "font-variant-numeric is active on ::cue", + property: "font-variant-numeric", + tagName: "video", + rules: ["video::cue { font-variant-numeric: ordinal; }"], + isActive: true, + }, + { + info: "font-variant-position is active on ::cue", + property: "font-variant-position", + tagName: "video", + rules: ["video::cue { font-variant-position: sub; }"], + isActive: true, + }, + { + info: "font-weight is active on ::cue", + property: "font-weight", + tagName: "video", + rules: ["video::cue { font-weight: bold; }"], + isActive: true, + }, + { + info: "line-height is active on ::cue", + property: "line-height", + tagName: "video", + rules: ["video::cue { line-height: 1.2; }"], + isActive: true, + }, + { + info: "opacity is active on ::cue", + property: "opacity", + tagName: "video", + rules: ["video::cue { opacity: 0.8; }"], + isActive: true, + }, + { + info: "outline is active on ::cue", + property: "outline", + tagName: "video", + rules: ["video::cue { outline: 1px solid red; }"], + isActive: true, + }, + { + info: "outline-color is active on ::cue", + property: "outline-color", + tagName: "video", + rules: ["video::cue { outline-color: red; }"], + isActive: true, + }, + { + info: "outline-offset is active on ::cue", + property: "outline-offset", + tagName: "video", + rules: ["video::cue { outline-offset: 1px; }"], + isActive: true, + }, + { + info: "outline-style is active on ::cue", + property: "outline-style", + tagName: "video", + rules: ["video::cue { outline-style: solid; }"], + isActive: true, + }, + { + info: "outline-width is active on ::cue", + property: "outline-width", + tagName: "video", + rules: ["video::cue { outline-width: 1px; }"], + isActive: true, + }, + { + info: "ruby-position is active on ::cue", + property: "ruby-position", + tagName: "video", + rules: ["video::cue { ruby-position: over; }"], + isActive: true, + }, + { + info: "text-combine-upright is active on ::cue", + property: "text-combine-upright", + tagName: "video", + rules: ["video::cue { text-combine-upright: all; }"], + isActive: true, + }, + { + info: "text-decoration is active on ::cue", + property: "text-decoration", + tagName: "video", + rules: ["video::cue { text-decoration: 1px underline red; }"], + isActive: true, + }, + { + info: "text-decoration-color is active on ::cue", + property: "text-decoration-color", + tagName: "video", + rules: ["video::cue { text-decoration-color: red; }"], + isActive: true, + }, + { + info: "text-decoration-line is active on ::cue", + property: "text-decoration-line", + tagName: "video", + rules: ["video::cue { text-decoration-line: underline; }"], + isActive: true, + }, + { + info: "text-decoration-style is active on ::cue", + property: "text-decoration-style", + tagName: "video", + rules: ["video::cue { text-decoration-style: wavy; }"], + isActive: true, + }, + { + info: "text-decoration-thickness is active on ::cue", + property: "text-decoration-thickness", + tagName: "video", + rules: ["video::cue { text-decoration-thickness: 1px; }"], + isActive: true, + }, + { + info: "text-shadow is active on ::cue", + property: "text-shadow", + tagName: "video", + rules: ["video::cue { text-shadow: 1px 1px 1px red; }"], + isActive: true, + }, + { + info: "visibility is active on ::cue", + property: "visibility", + tagName: "video", + rules: ["video::cue { visibility: hidden; }"], + isActive: true, + }, + { + info: "white-space is active on ::cue", + property: "white-space", + tagName: "video", + rules: ["video::cue { white-space: nowrap; }"], + isActive: true, + }, + { + info: "border is inactive on ::cue", + property: "border", + tagName: "video", + rules: ["video::cue { border: 1px solid red; }"], + isActive: false, + expectedMsgId: "inactive-css-cue-pseudo-element-not-supported", + }, + { + info: "display is inactive on ::cue", + property: "display", + tagName: "video", + rules: ["video::cue { display: grid; }"], + isActive: false, + expectedMsgId: "inactive-css-cue-pseudo-element-not-supported", + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/first-letter-pseudo-element.mjs b/devtools/server/tests/chrome/inactive-property-helper/first-letter-pseudo-element.mjs new file mode 100644 index 0000000000..ebce0d292a --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/first-letter-pseudo-element.mjs @@ -0,0 +1,32 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `first-letter-pseudo-element` test cases. + +// "content", + +export default [ + { + info: "content is inactive on ::first-letter", + property: "content", + tagName: "div", + rules: ["div::first-letter { content: 'invalid'; }"], + isActive: false, + expectedMsgId: "inactive-css-first-letter-pseudo-element-not-supported", + }, + { + info: "color is active on ::first-letter", + property: "color", + tagName: "div", + rules: ["div::first-letter { color: green; }"], + isActive: true, + }, + { + info: "display is active on ::first-letter", + property: "display", + tagName: "div", + rules: ["div::first-letter { display: grid; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/first-line-pseudo-element.mjs b/devtools/server/tests/chrome/inactive-property-helper/first-line-pseudo-element.mjs new file mode 100644 index 0000000000..68948a16bc --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/first-line-pseudo-element.mjs @@ -0,0 +1,50 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `first-line-pseudo-element` test cases. + +// "direction", +// "text-orientation", +// "writing-mode", + +export default [ + { + info: "direction is inactive on ::first-line", + property: "direction", + tagName: "div", + rules: ["div::first-line { direction: rtl; }"], + isActive: false, + expectedMsgId: "inactive-css-first-line-pseudo-element-not-supported", + }, + { + info: "text-orientation is inactive on ::first-line", + property: "text-orientation", + tagName: "div", + rules: ["div::first-line { text-orientation: sideways; }"], + isActive: false, + expectedMsgId: "inactive-css-first-line-pseudo-element-not-supported", + }, + { + info: "writing-mode is inactive on ::first-line", + property: "writing-mode", + tagName: "div", + rules: ["div::first-line { writing-mode: vertical-rl; }"], + isActive: false, + expectedMsgId: "inactive-css-first-line-pseudo-element-not-supported", + }, + { + info: "color is active on ::first-line", + property: "color", + tagName: "div", + rules: ["div::first-line { color: green; }"], + isActive: true, + }, + { + info: "display is active on ::first-line", + property: "display", + tagName: "div", + rules: ["div::first-line { display: grid; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/flex-grid-item-properties.mjs b/devtools/server/tests/chrome/inactive-property-helper/flex-grid-item-properties.mjs new file mode 100644 index 0000000000..79c587798a --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/flex-grid-item-properties.mjs @@ -0,0 +1,229 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `align-self`, `place-self`, and `order` test cases. +export default [ + { + info: "align-self is inactive on block element", + property: "align-self", + tagName: "div", + rules: ["div { align-self: center; }"], + isActive: false, + }, + { + info: "align-self is inactive on flex container", + property: "align-self", + tagName: "div", + rules: ["div { align-self: center; display: flex;}"], + isActive: false, + }, + { + info: "align-self is inactive on inline-flex container", + property: "align-self", + tagName: "div", + rules: ["div { align-self: center; display: inline-flex;}"], + isActive: false, + }, + { + info: "align-self is inactive on grid container", + property: "align-self", + tagName: "div", + rules: ["div { align-self: center; display: grid;}"], + isActive: false, + }, + { + info: "align-self is inactive on inline grid container", + property: "align-self", + tagName: "div", + rules: ["div { align-self: center; display: inline-grid;}"], + isActive: false, + }, + { + info: "align-self is inactive on inline element", + property: "align-self", + tagName: "span", + rules: ["span { align-self: center; }"], + isActive: false, + }, + { + info: "align-self is active on flex item", + property: "align-self", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: flex; align-items: start; }", + "span { align-self: center; }", + ], + ruleIndex: 1, + isActive: true, + }, + { + info: "align-self is active on grid item", + property: "align-self", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: grid; align-items: start; }", + "span { align-self: center; }", + ], + ruleIndex: 1, + isActive: true, + }, + { + info: "place-self is inactive on block element", + property: "place-self", + tagName: "div", + rules: ["div { place-self: center; }"], + isActive: false, + }, + { + info: "place-self is inactive on flex container", + property: "place-self", + tagName: "div", + rules: ["div { place-self: center; display: flex;}"], + isActive: false, + }, + { + info: "place-self is inactive on inline-flex container", + property: "place-self", + tagName: "div", + rules: ["div { place-self: center; display: inline-flex;}"], + isActive: false, + }, + { + info: "place-self is inactive on grid container", + property: "place-self", + tagName: "div", + rules: ["div { place-self: center; display: grid;}"], + isActive: false, + }, + { + info: "place-self is inactive on inline grid container", + property: "place-self", + tagName: "div", + rules: ["div { place-self: center; display: inline-grid;}"], + isActive: false, + }, + { + info: "place-self is inactive on inline element", + property: "place-self", + tagName: "span", + rules: ["span { place-self: center; }"], + isActive: false, + }, + { + info: "place-self is active on flex item", + property: "place-self", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: flex; align-items: start; }", + "span { place-self: center; }", + ], + ruleIndex: 1, + isActive: true, + }, + { + info: "place-self is active on grid item", + property: "place-self", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: grid; align-items: start; }", + "span { place-self: center; }", + ], + ruleIndex: 1, + isActive: true, + }, + { + info: "order is inactive on block element", + property: "order", + tagName: "div", + rules: ["div { order: 1; }"], + isActive: false, + }, + { + info: "order is inactive on flex container", + property: "order", + tagName: "div", + rules: ["div { order: 1; display: flex;}"], + isActive: false, + }, + { + info: "order is inactive on inline-flex container", + property: "order", + tagName: "div", + rules: ["div { order: 1; display: inline-flex;}"], + isActive: false, + }, + { + info: "order is inactive on grid container", + property: "order", + tagName: "div", + rules: ["div { order: 1; display: grid;}"], + isActive: false, + }, + { + info: "order is inactive on inline grid container", + property: "order", + tagName: "div", + rules: ["div { order: 1; display: inline-grid;}"], + isActive: false, + }, + { + info: "order is inactive on inline element", + property: "order", + tagName: "span", + rules: ["span { order: 1; }"], + isActive: false, + }, + { + info: "order is active on flex item", + property: "order", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: flex; }", "span { order: 1; }"], + ruleIndex: 1, + isActive: true, + }, + { + info: "order is active on grid item", + property: "order", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: grid; }", "span { order: 1; }"], + ruleIndex: 1, + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/float.mjs b/devtools/server/tests/chrome/inactive-property-helper/float.mjs new file mode 100644 index 0000000000..4c502e3cca --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/float.mjs @@ -0,0 +1,76 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `float` test cases. +export default [ + { + info: "display: inline is inactive on a floated element", + property: "display", + tagName: "div", + rules: ["div { display: inline; float: right; }"], + isActive: false, + }, + { + info: "display: block is active on a floated element", + property: "display", + tagName: "div", + rules: ["div { display: block; float: right;}"], + isActive: true, + }, + { + info: "display: inline-grid is inactive on a floated element", + property: "display", + createTestElement: rootNode => { + const container = document.createElement("div"); + container.classList.add("test"); + rootNode.append(container); + return container; + }, + rules: [ + "div { float: left; display:block; }", + ".test { display: inline-grid ;}", + ], + isActive: false, + }, + { + info: "display: table-footer-group is inactive on a floated element", + property: "display", + createTestElement: rootNode => { + const container = document.createElement("div"); + container.style.display = "table"; + const footer = document.createElement("div"); + footer.classList.add("table-footer"); + container.append(footer); + rootNode.append(container); + return footer; + }, + rules: [".table-footer { display: table-footer-group; float: left;}"], + isActive: false, + }, + createGridPlacementOnFloatedItemTest("grid-row"), + createGridPlacementOnFloatedItemTest("grid-column"), + createGridPlacementOnFloatedItemTest("grid-area", "foo"), +]; + +function createGridPlacementOnFloatedItemTest(property, value = "2") { + return { + info: `grid placement property ${property} is active on a floated grid item`, + property, + createTestElement: rootNode => { + const grid = document.createElement("div"); + grid.style.display = "grid"; + grid.style.gridTemplateRows = "repeat(5, 1fr)"; + grid.style.gridTemplateColumns = "repeat(5, 1fr)"; + grid.style.gridTemplateAreas = "'foo foo foo'"; + rootNode.appendChild(grid); + + const item = document.createElement("span"); + grid.appendChild(item); + + return item; + }, + rules: [`span { ${property}: ${value}; float: left; }`], + isActive: true, + }; +} diff --git a/devtools/server/tests/chrome/inactive-property-helper/gap.mjs b/devtools/server/tests/chrome/inactive-property-helper/gap.mjs new file mode 100644 index 0000000000..83befcba0d --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/gap.mjs @@ -0,0 +1,133 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `gap` test cases. +export default [ + { + info: "column-gap is inactive on non-grid and non-flex container", + property: "column-gap", + tagName: "div", + rules: ["div { column-gap: 10px; display: block; }"], + isActive: false, + }, + { + info: "column-gap is active on grid container", + property: "column-gap", + tagName: "div", + rules: ["div { column-gap: 10px; display: grid; }"], + isActive: true, + }, + { + info: "column-gap is active on flex container", + property: "column-gap", + tagName: "div", + rules: ["div { column-gap: 10px; display: flex; }"], + isActive: true, + }, + { + info: "column-gap is inactive on non-multi-col container", + property: "column-gap", + tagName: "div", + rules: ["div { column-gap: 10px; column-count: auto; }"], + isActive: false, + }, + { + info: "column-gap is active on multi-column container", + property: "column-gap", + tagName: "div", + rules: ["div { column-gap: 10px; column-count: 2; }"], + isActive: true, + }, + { + info: "row-gap is inactive on non-grid and non-flex container", + property: "row-gap", + tagName: "div", + rules: ["div { row-gap: 10px; display: block; }"], + isActive: false, + }, + { + info: "row-gap is active on grid container", + property: "row-gap", + tagName: "div", + rules: ["div { row-gap: 10px; display: grid; }"], + isActive: true, + }, + { + info: "row-gap is active on flex container", + property: "row-gap", + tagName: "div", + rules: ["div { row-gap: 10px; display: flex; }"], + isActive: true, + }, + { + info: "gap is inactive on non-grid and non-flex container", + property: "gap", + tagName: "div", + rules: ["div { gap: 10px; display: block; }"], + isActive: false, + }, + { + info: "gap is active on flex container", + property: "gap", + tagName: "div", + rules: ["div { gap: 10px; display: flex; }"], + isActive: true, + }, + { + info: "gap is active on grid container", + property: "gap", + tagName: "div", + rules: ["div { gap: 10px; display: grid; }"], + isActive: true, + }, + { + info: "gap is inactive on non-multi-col container", + property: "gap", + tagName: "div", + rules: ["div { gap: 10px; column-count: auto; }"], + isActive: false, + }, + { + info: "gap is active on multi-col container", + property: "gap", + tagName: "div", + rules: ["div { gap: 10px; column-count: 2; }"], + isActive: true, + }, + { + info: "grid-gap is inactive on non-grid and non-flex container", + property: "grid-gap", + tagName: "div", + rules: ["div { grid-gap: 10px; display: block; }"], + isActive: false, + }, + { + info: "grid-gap is active on flex container", + property: "grid-gap", + tagName: "div", + rules: ["div { grid-gap: 10px; display: flex; }"], + isActive: true, + }, + { + info: "grid-gap is active on grid container", + property: "grid-gap", + tagName: "div", + rules: ["div { grid-gap: 10px; display: grid; }"], + isActive: true, + }, + { + info: "grid-gap is inactive on non-multi-col container", + property: "grid-gap", + tagName: "div", + rules: ["div { grid-gap: 10px; column-count: auto; }"], + isActive: false, + }, + { + info: "grid-gap is active on multi-col container", + property: "grid-gap", + tagName: "div", + rules: ["div { grid-gap: 10px; column-count: 2; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/grid-container-properties.mjs b/devtools/server/tests/chrome/inactive-property-helper/grid-container-properties.mjs new file mode 100644 index 0000000000..1fca234733 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/grid-container-properties.mjs @@ -0,0 +1,43 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper test cases: +// `grid-auto-columns`, `grid-auto-flow`, `grid-auto-rows`, `grid-template`, +// `grid-template-areas`, `grid-template-columns`, `grid-template-rows`, +// and `justify-items`. +let tests = []; + +for (const { propertyName, propertyValue } of [ + { propertyName: "grid-auto-columns", propertyValue: "100px" }, + { propertyName: "grid-auto-flow", propertyValue: "columns" }, + { propertyName: "grid-auto-rows", propertyValue: "100px" }, + { propertyName: "grid-template", propertyValue: "auto / auto" }, + { propertyName: "grid-template-areas", propertyValue: "a b c" }, + { propertyName: "grid-template-columns", propertyValue: "100px 1fr" }, + { propertyName: "grid-template-rows", propertyValue: "100px 1fr" }, + { propertyName: "justify-items", propertyValue: "center" }, +]) { + tests = tests.concat(createTestsForProp(propertyName, propertyValue)); +} + +function createTestsForProp(propertyName, propertyValue) { + return [ + { + info: `${propertyName} is active on a grid container`, + property: propertyName, + tagName: "div", + rules: [`div { display:grid; ${propertyName}: ${propertyValue}; }`], + isActive: true, + }, + { + info: `${propertyName} is inactive on a non-grid container`, + property: propertyName, + tagName: "div", + rules: [`div { ${propertyName}: ${propertyValue}; }`], + isActive: false, + }, + ]; +} + +export default tests; diff --git a/devtools/server/tests/chrome/inactive-property-helper/grid-with-absolute-properties.mjs b/devtools/server/tests/chrome/inactive-property-helper/grid-with-absolute-properties.mjs new file mode 100644 index 0000000000..fd963e0d3b --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/grid-with-absolute-properties.mjs @@ -0,0 +1,71 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper test cases: +// `grid-area`, `grid-column`, `grid-column-end`, `grid-column-start`, +// `grid-row`, `grid-row-end`, `grid-row-start`, `justify-self`, `align-self` +// and `place-self`. +let tests = []; + +for (const { propertyName, propertyValue } of [ + { propertyName: "grid-area", propertyValue: "2 / 1 / span 2 / span 3" }, + { propertyName: "grid-column", propertyValue: 2 }, + { propertyName: "grid-column-end", propertyValue: "span 3" }, + { propertyName: "grid-column-start", propertyValue: 2 }, + { propertyName: "grid-row", propertyValue: "1 / span 2" }, + { propertyName: "grid-row-end", propertyValue: "span 3" }, + { propertyName: "grid-row-start", propertyValue: 2 }, + { propertyName: "justify-self", propertyValue: "start" }, + { propertyName: "align-self", propertyValue: "auto" }, + { propertyName: "place-self", propertyValue: "auto center" }, +]) { + tests = tests.concat(createTestsForProp(propertyName, propertyValue)); +} + +function createTestsForProp(propertyName, propertyValue) { + return [ + { + info: `${propertyName} is active on a grid item`, + property: `${propertyName}`, + createTestElement, + rules: [ + `#grid-container { display:grid; grid:auto/100px 100px; }`, + `#grid-item { ${propertyName}: ${propertyValue}; }`, + ], + ruleIndex: 1, + isActive: true, + }, + { + info: `${propertyName} is active on an absolutely positioned grid item`, + property: `${propertyName}`, + createTestElement, + rules: [ + `#grid-container { display:grid; grid:auto/100px 100px; position: relative }`, + `#grid-item { ${propertyName}: ${propertyValue}; position: absolute; }`, + ], + ruleIndex: 1, + isActive: true, + }, + { + info: `${propertyName} is inactive on a non-grid item`, + property: `${propertyName}`, + tagName: `div`, + rules: [`div { ${propertyName}: ${propertyValue}; }`], + isActive: false, + }, + ]; +} + +function createTestElement(rootNode) { + const container = document.createElement("div"); + container.id = "grid-container"; + const element = document.createElement("div"); + element.id = "grid-item"; + container.append(element); + rootNode.append(container); + + return element; +} + +export default tests; diff --git a/devtools/server/tests/chrome/inactive-property-helper/highlight-pseudo-elements.mjs b/devtools/server/tests/chrome/inactive-property-helper/highlight-pseudo-elements.mjs new file mode 100644 index 0000000000..bcb5b8763c --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/highlight-pseudo-elements.mjs @@ -0,0 +1,155 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `highlight-pseudo-elements` test cases. + +// "background", +// "background-color", +// "color", +// "fill-color", +// "stroke-color", +// "stroke-width", +// "text-decoration", +// "text-shadow", +// "text-underline-offset", +// "text-underline-position", + +export default [ + { + info: "width is inactive on ::selection", + property: "width", + tagName: "span", + rules: ["span::selection { width: 10px; }"], + isActive: false, + // `width` is also inactive on inline element, so make sure we get the warning + // because we're using it in a highlight pseudo. + expectedMsgId: "inactive-css-highlight-pseudo-elements-not-supported", + }, + { + info: "display is inactive on ::highlight", + property: "display", + tagName: "span", + rules: ["span::highlight(result) { display: grid; }"], + isActive: false, + expectedMsgId: "inactive-css-highlight-pseudo-elements-not-supported", + }, + { + // accept background shorthand, even if it might hold inactive values + info: "background is active on ::selection", + property: "background", + tagName: "span", + rules: ["span::selection { background: red; }"], + isActive: true, + }, + { + info: "border-color is inactive on ::selection", + property: "border-color", + tagName: "span", + rules: ["span::selection { border-color: red; }"], + isActive: false, + // `width` is also inactive on inline element, so make sure we get the warning + // because we're using it in a highlight pseudo. + expectedMsgId: "inactive-css-highlight-pseudo-elements-not-supported", + }, + { + info: "background-color is active on ::selection", + property: "background-color", + tagName: "span", + rules: ["span::selection { background-color: red; }"], + isActive: true, + }, + { + info: "color is active on ::selection", + property: "color", + tagName: "span", + rules: ["span::selection { color: red; }"], + isActive: true, + }, + { + info: "text-decoration is active on ::selection", + property: "text-decoration", + tagName: "span", + rules: [ + "span::selection { text-decoration: double overline #FF3028 4px; }", + ], + isActive: true, + }, + { + info: "text-decoration-color is active on ::selection", + property: "text-decoration-color", + tagName: "span", + rules: ["span::selection { text-decoration-color: #FF3028; }"], + isActive: true, + }, + { + info: "text-decoration-line is active on ::selection", + property: "text-decoration-line", + tagName: "span", + rules: ["span::selection { text-decoration-line: overline; }"], + isActive: true, + }, + { + info: "text-decoration-style is active on ::selection", + property: "text-decoration-style", + tagName: "span", + rules: ["span::selection { text-decoration-style: double; }"], + isActive: true, + }, + { + info: "text-decoration-thickness is active on ::selection", + property: "text-decoration-thickness", + tagName: "span", + rules: ["span::selection { text-decoration-thickness: 4px; }"], + isActive: true, + }, + { + info: "text-shadow is active on ::selection", + property: "text-shadow", + tagName: "span", + rules: ["span::selection { text-shadow: text-shadow: #FC0 1px 0 10px; }"], + isActive: true, + }, + { + info: "text-underline-offset is active on ::selection", + property: "text-underline-offset", + tagName: "span", + rules: ["span::selection { text-underline-offset: 10px; }"], + isActive: true, + }, + { + info: "text-underline-position is active on ::selection", + property: "text-underline-position", + tagName: "span", + rules: ["span::selection { text-underline-position: under; }"], + isActive: true, + }, + { + info: "-webkit-text-fill-color is active on ::selection", + property: "-webkit-text-fill-color", + tagName: "span", + rules: ["span::selection { -webkit-text-fill-color: red; }"], + isActive: true, + }, + { + info: "-webkit-text-stroke-color is active on ::selection", + property: "-webkit-text-stroke-color", + tagName: "span", + rules: ["span::selection { -webkit-text-stroke-color: red; }"], + isActive: true, + }, + { + info: "-webkit-text-stroke-width is active on ::selection", + property: "-webkit-text-stroke-width", + tagName: "span", + rules: ["span::selection { -webkit-text-stroke-width: 4px; }"], + isActive: true, + }, + { + info: "-webkit-text-stroke is active on ::selection", + property: "-webkit-text-stroke", + tagName: "span", + rules: ["span::selection { -webkit-text-stroke: 4px navy; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/margin-padding.mjs b/devtools/server/tests/chrome/inactive-property-helper/margin-padding.mjs new file mode 100644 index 0000000000..7c1d348512 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/margin-padding.mjs @@ -0,0 +1,260 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `align-content` test cases. + +export default [ + { + info: "margin is active on block containers", + property: "margin", + tagName: "div", + rules: ["div { margin: 10px; }"], + isActive: true, + }, + { + info: "margin is active on flex containers", + property: "margin", + tagName: "div", + rules: ["div { display: flex; margin: 10px; }"], + isActive: true, + }, + { + info: "margin is active on grid containers", + property: "margin", + tagName: "div", + rules: ["div { display: grid; margin: 10px; }"], + isActive: true, + }, + { + info: "margin is active on tables", + property: "margin", + tagName: "div", + rules: ["div { display: table; margin: 10px; }"], + isActive: true, + }, + { + info: "margin is active on inline tables", + property: "margin", + tagName: "div", + rules: ["div { display: inline-table; margin: 10px; }"], + isActive: true, + }, + { + info: "margin is active on table captions", + property: "margin", + tagName: "div", + rules: ["div { display: table-caption; margin: 10px; }"], + isActive: true, + }, + { + info: "margin is inactive on table cells", + property: "margin", + tagName: "div", + rules: ["div { display: table-cell; margin: 10px; }"], + isActive: false, + }, + { + info: "margin-block is inactive on table cells", + property: "margin-block", + tagName: "div", + rules: ["div { display: table-cell; margin-block: 10px; }"], + isActive: false, + }, + { + info: "margin-block-start is inactive on table cells", + property: "margin-block-start", + tagName: "div", + rules: ["div { display: table-cell; margin-block-start: 10px; }"], + isActive: false, + }, + { + info: "margin-block-end is inactive on table cells", + property: "margin-block-end", + tagName: "div", + rules: ["div { display: table-cell; margin-block-end: 10px; }"], + isActive: false, + }, + { + info: "margin-block is inactive on table cells", + property: "margin-block", + tagName: "div", + rules: ["div { display: table-cell; margin-block: 10px; }"], + isActive: false, + }, + { + info: "margin-bottom is inactive on table rows", + property: "margin-bottom", + tagName: "div", + rules: ["div { display: table-row; margin-bottom: 10px; }"], + isActive: false, + }, + { + info: "margin-inline-start is inactive on table rows", + property: "margin-inline-start", + tagName: "div", + rules: ["div { display: table-row; margin-inline-start: 10px; }"], + isActive: false, + }, + { + info: "margin-inline-end is inactive on table rows", + property: "margin-inline-end", + tagName: "div", + rules: ["div { display: table-row; margin-inline-end: 10px; }"], + isActive: false, + }, + { + info: "margin-inline is inactive on table rows", + property: "margin-inline", + tagName: "div", + rules: ["div { display: table-row; margin-inline: 10px; }"], + isActive: false, + }, + { + info: "margin-left is inactive on table columns", + property: "margin-left", + tagName: "div", + rules: ["div { display: table-column; margin-left: 10px; }"], + isActive: false, + }, + { + info: "margin-right is inactive on table row groups", + property: "margin-right", + tagName: "div", + rules: ["div { display: table-row-group; margin-right: 10px; }"], + isActive: false, + }, + { + info: "margin-top is inactive on table column groups", + property: "margin-top", + tagName: "div", + rules: ["div { display: table-column-group; margin-top: 10px; }"], + isActive: false, + }, + { + info: "padding is active on block containers", + property: "padding", + tagName: "div", + rules: ["div { padding: 10px; }"], + isActive: true, + }, + { + info: "padding is active on flex containers", + property: "padding", + tagName: "div", + rules: ["div { display: flex; padding: 10px; }"], + isActive: true, + }, + { + info: "padding is active on grid containers", + property: "padding", + tagName: "div", + rules: ["div { display: grid; padding: 10px; }"], + isActive: true, + }, + { + info: "padding is active on tables", + property: "padding", + tagName: "div", + rules: ["div { display: table; padding: 10px; }"], + isActive: true, + }, + { + info: "padding is active on inline tables", + property: "padding", + tagName: "div", + rules: ["div { display: inline-table; padding: 10px; }"], + isActive: true, + }, + { + info: "padding is active on table captions", + property: "padding", + tagName: "div", + rules: ["div { display: table-caption; padding: 10px; }"], + isActive: true, + }, + { + info: "padding is active on table cells", + property: "padding", + tagName: "div", + rules: ["div { display: table-cell; padding: 10px; }"], + isActive: true, + }, + { + info: "padding-block is active on table cells", + property: "padding-block", + tagName: "div", + rules: ["div { display: table-cell; padding-block: 10px; }"], + isActive: true, + }, + { + info: "padding-block-start is active on table cells", + property: "padding-block-start", + tagName: "div", + rules: ["div { display: table-cell; padding-block-start: 10px; }"], + isActive: true, + }, + { + info: "padding-block-end is active on table cells", + property: "padding-block-end", + tagName: "div", + rules: ["div { display: table-cell; padding-block-end: 10px; }"], + isActive: true, + }, + { + info: "padding-block is active on table cells", + property: "padding-block", + tagName: "div", + rules: ["div { display: table-cell; padding-block: 10px; }"], + isActive: true, + }, + { + info: "padding-bottom is inactive on table rows", + property: "padding-bottom", + tagName: "div", + rules: ["div { display: table-row; padding-bottom: 10px; }"], + isActive: false, + }, + { + info: "padding-inline-start is inactive on table rows", + property: "padding-inline-start", + tagName: "div", + rules: ["div { display: table-row; padding-inline-start: 10px; }"], + isActive: false, + }, + { + info: "padding-inline-end is inactive on table rows", + property: "padding-inline-end", + tagName: "div", + rules: ["div { display: table-row; padding-inline-end: 10px; }"], + isActive: false, + }, + { + info: "padding-inline is inactive on table rows", + property: "padding-inline", + tagName: "div", + rules: ["div { display: table-row; padding-inline: 10px; }"], + isActive: false, + }, + { + info: "padding-left is inactive on table columns", + property: "padding-left", + tagName: "div", + rules: ["div { display: table-column; padding-left: 10px; }"], + isActive: false, + }, + { + info: "padding-right is inactive on table row groups", + property: "padding-right", + tagName: "div", + rules: ["div { display: table-row-group; padding-right: 10px; }"], + isActive: false, + }, + { + info: "padding-top is inactive on table column groups", + property: "padding-top", + tagName: "div", + rules: ["div { display: table-column-group; padding-top: 10px; }"], + isActive: false, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/max-min-width-height.mjs b/devtools/server/tests/chrome/inactive-property-helper/max-min-width-height.mjs new file mode 100644 index 0000000000..4bb5623f6e --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/max-min-width-height.mjs @@ -0,0 +1,366 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `width`, `min-width`, `max-width`, `height`, `min-height`, +// `max-height` test cases. +export default [ + { + info: "width is inactive on a non-replaced inline element", + property: "width", + tagName: "span", + rules: ["span { width: 500px; }"], + isActive: false, + }, + { + info: "min-width is inactive on a non-replaced inline element", + property: "min-width", + tagName: "span", + rules: ["span { min-width: 500px; }"], + isActive: false, + }, + { + info: "max-width is inactive on a non-replaced inline element", + property: "max-width", + tagName: "span", + rules: ["span { max-width: 500px; }"], + isActive: false, + }, + { + info: "width is inactive on an tr element", + property: "width", + tagName: "tr", + rules: ["tr { width: 500px; }"], + isActive: false, + }, + { + info: "min-width is inactive on an tr element", + property: "min-width", + tagName: "tr", + rules: ["tr { min-width: 500px; }"], + isActive: false, + }, + { + info: "max-width is inactive on an tr element", + property: "max-width", + tagName: "tr", + rules: ["tr { max-width: 500px; }"], + isActive: false, + }, + { + info: "width is inactive on an thead element", + property: "width", + tagName: "thead", + rules: ["thead { width: 500px; }"], + isActive: false, + }, + { + info: "min-width is inactive on an thead element", + property: "min-width", + tagName: "thead", + rules: ["thead { min-width: 500px; }"], + isActive: false, + }, + { + info: "max-width is inactive on an thead element", + property: "max-width", + tagName: "thead", + rules: ["thead { max-width: 500px; }"], + isActive: false, + }, + { + info: "width is inactive on an tfoot element", + property: "width", + tagName: "tfoot", + rules: ["tfoot { width: 500px; }"], + isActive: false, + }, + { + info: "min-width is inactive on an tfoot element", + property: "min-width", + tagName: "tfoot", + rules: ["tfoot { min-width: 500px; }"], + isActive: false, + }, + { + info: "max-width is inactive on an tfoot element", + property: "max-width", + tagName: "tfoot", + rules: ["tfoot { max-width: 500px; }"], + isActive: false, + }, + { + info: "width is active on a replaced inline element", + property: "width", + tagName: "img", + rules: ["img { width: 500px; }"], + isActive: true, + }, + { + info: "width is active on an inline input element", + property: "width", + tagName: "input", + rules: ["input { display: inline; width: 500px; }"], + isActive: true, + }, + { + info: "width is active on an inline select element", + property: "width", + tagName: "select", + rules: ["select { display: inline; width: 500px; }"], + isActive: true, + }, + { + info: "width is active on a textarea element", + property: "width", + tagName: "textarea", + rules: ["textarea { width: 500px; }"], + isActive: true, + }, + { + info: "min-width is active on a replaced inline element", + property: "min-width", + tagName: "img", + rules: ["img { min-width: 500px; }"], + isActive: true, + }, + { + info: "max-width is active on a replaced inline element", + property: "max-width", + tagName: "img", + rules: ["img { max-width: 500px; }"], + isActive: true, + }, + { + info: "width is active on a block element", + property: "width", + tagName: "div", + rules: ["div { width: 500px; }"], + isActive: true, + }, + { + info: "min-width is active on a block element", + property: "min-width", + tagName: "div", + rules: ["div { min-width: 500px; }"], + isActive: true, + }, + { + info: "max-width is active on a block element", + property: "max-width", + tagName: "div", + rules: ["div { max-width: 500px; }"], + isActive: true, + }, + { + info: "height is inactive on a non-replaced inline element", + property: "height", + tagName: "span", + rules: ["span { height: 500px; }"], + isActive: false, + }, + { + info: "min-height is inactive on a non-replaced inline element", + property: "min-height", + tagName: "span", + rules: ["span { min-height: 500px; }"], + isActive: false, + }, + { + info: "max-height is inactive on a non-replaced inline element", + property: "max-height", + tagName: "span", + rules: ["span { max-height: 500px; }"], + isActive: false, + }, + { + info: "height is inactive on colgroup element", + property: "height", + tagName: "colgroup", + rules: ["colgroup { height: 500px; }"], + isActive: false, + }, + { + info: "min-height is inactive on colgroup element", + property: "min-height", + tagName: "colgroup", + rules: ["colgroup { min-height: 500px; }"], + isActive: false, + }, + { + info: "max-height is inactive on colgroup element", + property: "max-height", + tagName: "colgroup", + rules: ["colgroup { max-height: 500px; }"], + isActive: false, + }, + { + info: "height is inactive on col element", + property: "height", + tagName: "col", + rules: ["col { height: 500px; }"], + isActive: false, + }, + { + info: "min-height is inactive on col element", + property: "min-height", + tagName: "col", + rules: ["col { min-height: 500px; }"], + isActive: false, + }, + { + info: "max-height is inactive on col element", + property: "max-height", + tagName: "col", + rules: ["col { max-height: 500px; }"], + isActive: false, + }, + { + info: "height is active on a replaced inline element", + property: "height", + tagName: "img", + rules: ["img { height: 500px; }"], + isActive: true, + }, + { + info: "height is active on an inline input element", + property: "height", + tagName: "input", + rules: ["input { display: inline; height: 500px; }"], + isActive: true, + }, + { + info: "height is active on an inline select element", + property: "height", + tagName: "select", + rules: ["select { display: inline; height: 500px; }"], + isActive: true, + }, + { + info: "height is active on a textarea element", + property: "height", + tagName: "textarea", + rules: ["textarea { height: 500px; }"], + isActive: true, + }, + { + info: "min-height is active on a replaced inline element", + property: "min-height", + tagName: "img", + rules: ["img { min-height: 500px; }"], + isActive: true, + }, + { + info: "max-height is active on a replaced inline element", + property: "max-height", + tagName: "img", + rules: ["img { max-height: 500px; }"], + isActive: true, + }, + { + info: "height is active on a block element", + property: "height", + tagName: "div", + rules: ["div { height: 500px; }"], + isActive: true, + }, + { + info: "min-height is active on a block element", + property: "min-height", + tagName: "div", + rules: ["div { min-height: 500px; }"], + isActive: true, + }, + { + info: "max-height is active on a block element", + property: "max-height", + tagName: "div", + rules: ["div { max-height: 500px; }"], + isActive: true, + }, + { + info: "height is active on an svg element.", + property: "height", + createTestElement: main => { + main.innerHTML = ` + + + + `; + return main.querySelector("rect"); + }, + rules: ["rect { height: 100px; }"], + isActive: true, + }, + createTableElementTestCase("width", false, "table-row"), + createTableElementTestCase("width", false, "table-row-group"), + createTableElementTestCase("width", true, "table-column"), + createTableElementTestCase("width", true, "table-column-group"), + createTableElementTestCase("height", false, "table-column"), + createTableElementTestCase("height", false, "table-column-group"), + createTableElementTestCase("height", true, "table-row"), + createTableElementTestCase("height", true, "table-row-group"), + createVerticalTableElementTestCase("width", true, "table-row"), + createVerticalTableElementTestCase("width", true, "table-row-group"), + createVerticalTableElementTestCase("width", false, "table-column"), + createVerticalTableElementTestCase("width", false, "table-column-group"), + createVerticalTableElementTestCase("height", true, "table-column"), + createVerticalTableElementTestCase("height", true, "table-column-group"), + createVerticalTableElementTestCase("height", false, "table-row"), + createVerticalTableElementTestCase("height", false, "table-row-group"), + { + info: "width's inactivity status for a row takes the table's writing mode into account", + property: "width", + createTestElement: rootNode => { + const table = document.createElement("table"); + table.style.writingMode = "vertical-lr"; + rootNode.appendChild(table); + + const tbody = document.createElement("tbody"); + table.appendChild(tbody); + + const tr = document.createElement("tr"); + tbody.appendChild(tr); + + const td = document.createElement("td"); + tr.appendChild(td); + + return tr; + }, + rules: ["tr { writing-mode: horizontal-tb; width: 360px; }"], + isActive: true, + }, +]; + +function createTableElementTestCase(property, isActive, displayType) { + return { + info: `${property} is ${ + isActive ? "active" : "inactive" + } on a ${displayType}`, + property, + tagName: "div", + rules: [`div { display: ${displayType}; ${property}: 100px; }`], + isActive, + }; +} + +function createVerticalTableElementTestCase(property, isActive, displayType) { + return { + info: `${property} is ${ + isActive ? "active" : "inactive" + } on a vertical ${displayType}`, + property, + createTestElement: rootNode => { + const container = document.createElement("div"); + container.style.writingMode = "vertical-lr"; + rootNode.append(container); + + const element = document.createElement("span"); + container.append(element); + + return element; + }, + rules: [`span { display: ${displayType}; ${property}: 100px; }`], + isActive, + }; +} diff --git a/devtools/server/tests/chrome/inactive-property-helper/multicol-container-properties.mjs b/devtools/server/tests/chrome/inactive-property-helper/multicol-container-properties.mjs new file mode 100644 index 0000000000..6bc4e9dd13 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/multicol-container-properties.mjs @@ -0,0 +1,39 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper test cases: +// `column-fill`, `column-rule`, `column-rule-color`, `column-rule-style`, +// and `column-rule-width`. +let tests = []; + +for (const { propertyName, propertyValue } of [ + { propertyName: "column-fill", propertyValue: "auto" }, + { propertyName: "column-rule", propertyValue: "1px solid black" }, + { propertyName: "column-rule-color", propertyValue: "black" }, + { propertyName: "column-rule-style", propertyValue: "solid" }, + { propertyName: "column-rule-width", propertyValue: "1px" }, +]) { + tests = tests.concat(createTestsForProp(propertyName, propertyValue)); +} + +function createTestsForProp(propertyName, propertyValue) { + return [ + { + info: `${propertyName} is active on a multi-column container`, + property: propertyName, + tagName: "div", + rules: [`div { columns:2; ${propertyName}: ${propertyValue}; }`], + isActive: true, + }, + { + info: `${propertyName} is inactive on a non-multi-column container`, + property: propertyName, + tagName: "div", + rules: [`div { ${propertyName}: ${propertyValue}; }`], + isActive: false, + }, + ]; +} + +export default tests; diff --git a/devtools/server/tests/chrome/inactive-property-helper/place-items-content.mjs b/devtools/server/tests/chrome/inactive-property-helper/place-items-content.mjs new file mode 100644 index 0000000000..f554a785a7 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/place-items-content.mjs @@ -0,0 +1,159 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `place-items` and `place-content` test cases. +export default [ + { + info: "place-items is inactive on block element", + property: "place-items", + tagName: "div", + rules: ["div { place-items: center; }"], + isActive: false, + }, + { + info: "place-items is inactive on inline element", + property: "place-items", + tagName: "span", + rules: ["span { place-items: center; }"], + isActive: false, + }, + { + info: "place-items is inactive on flex item", + property: "place-items", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: flex; align-items: start; }", + "span { place-items: center; }", + ], + ruleIndex: 1, + isActive: false, + }, + { + info: "place-items is inactive on grid item", + property: "place-items", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: grid; align-items: start; }", + "span { place-items: center; }", + ], + ruleIndex: 1, + isActive: false, + }, + { + info: "place-items is active on flex container", + property: "place-items", + tagName: "div", + rules: ["div { place-items: center; display: flex;}"], + isActive: true, + }, + { + info: "place-items is active on inline-flex container", + property: "place-items", + tagName: "div", + rules: ["div { place-items: center; display: inline-flex;}"], + isActive: true, + }, + { + info: "place-items is active on grid container", + property: "place-items", + tagName: "div", + rules: ["div { place-items: center; display: grid;}"], + isActive: true, + }, + { + info: "place-items is active on inline grid container", + property: "place-items", + tagName: "div", + rules: ["div { place-items: center; display: inline-grid;}"], + isActive: true, + }, + { + info: "place-content is inactive on block element", + property: "place-content", + tagName: "div", + rules: ["div { place-content: center; }"], + isActive: false, + }, + { + info: "place-content is inactive on inline element", + property: "place-content", + tagName: "span", + rules: ["span { place-content: center; }"], + isActive: false, + }, + { + info: "place-content is inactive on flex item", + property: "place-content", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: flex; align-items: start; }", + "span { place-content: center; }", + ], + ruleIndex: 1, + isActive: false, + }, + { + info: "place-content is inactive on grid item", + property: "place-content", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: [ + "div { display: grid; align-items: start; }", + "span { place-content: center; }", + ], + ruleIndex: 1, + isActive: false, + }, + { + info: "place-content is active on flex container", + property: "place-content", + tagName: "div", + rules: ["div { place-content: center; display: flex;}"], + isActive: true, + }, + { + info: "place-content is active on inline-flex container", + property: "place-content", + tagName: "div", + rules: ["div { place-content: center; display: inline-flex;}"], + isActive: true, + }, + { + info: "place-content is active on grid container", + property: "place-content", + tagName: "div", + rules: ["div { place-content: center; display: grid;}"], + isActive: true, + }, + { + info: "place-content is active on inline grid container", + property: "place-content", + tagName: "div", + rules: ["div { place-content: center; display: inline-grid;}"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/placeholder-pseudo-element.mjs b/devtools/server/tests/chrome/inactive-property-helper/placeholder-pseudo-element.mjs new file mode 100644 index 0000000000..6c9a81472b --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/placeholder-pseudo-element.mjs @@ -0,0 +1,122 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `placeholder-pseudo-element` test cases. + +//"baseline-source", +//"direction", +//"dominant-baseline", +//"line-height", +//"text-orientation", +//"vertical-align", +//"writing-mode", +//"alignment-baseline", +//"baseline-shift", +//"initial-letter", +//"text-box-trim", + +export default [ + { + info: "baseline-source is inactive on ::placeholder", + property: "baseline-source", + tagName: "input", + rules: ["input::placeholder { baseline-source: first; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "direction is inactive on ::placeholder", + property: "direction", + tagName: "input", + rules: ["input::placeholder { direction: rtl; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "dominant-baseline is inactive on ::placeholder", + property: "dominant-baseline", + tagName: "input", + rules: ["input::placeholder { dominant-baseline: central; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "line-height is inactive on ::placeholder", + property: "line-height", + tagName: "input", + rules: ["input::placeholder { line-height: 2em; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "text-orientation is inactive on ::placeholder", + property: "text-orientation", + tagName: "input", + rules: ["input::placeholder { text-orientation: sideways; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "vertical-align is inactive on ::placeholder", + property: "vertical-align", + tagName: "input", + rules: ["input::placeholder { vertical-align: super; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "writing-mode is inactive on ::placeholder", + property: "writing-mode", + tagName: "input", + rules: ["input::placeholder { writing-mode: vertical-rl; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "alignment-baseline is inactive on ::placeholder", + property: "alignment-baseline", + tagName: "input", + rules: ["input::placeholder { alignment-baseline: central; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "baseline-shift is inactive on ::placeholder", + property: "baseline-shift", + tagName: "input", + rules: ["input::placeholder { baseline-shift: super; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "initial-letter is inactive on ::placeholder", + property: "initial-letter", + tagName: "input", + rules: ["input::placeholder { initial-letter: 2em; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "text-box-trim is inactive on ::placeholder", + property: "text-box-trim", + tagName: "input", + rules: ["input::placeholder { text-box-trim: both; }"], + isActive: false, + expectedMsgId: "inactive-css-placeholder-pseudo-element-not-supported", + }, + { + info: "color is active on ::placeholder", + property: "color", + tagName: "input", + rules: ["input::placeholder { color: green; }"], + isActive: true, + }, + { + info: "display is active on ::placeholder", + property: "display", + tagName: "input", + rules: ["input::placeholder { display: grid; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/positioned.mjs b/devtools/server/tests/chrome/inactive-property-helper/positioned.mjs new file mode 100644 index 0000000000..0386c278c5 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/positioned.mjs @@ -0,0 +1,82 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper positioned elements test cases. + +// These are the properties we care about, those that are inactive when the element isn't +// positioned. +const PROPERTIES = [ + { property: "z-index", value: "2" }, + { property: "top", value: "20px" }, + { property: "right", value: "20px" }, + { property: "bottom", value: "20px" }, + { property: "left", value: "20px" }, +]; + +// These are all of the different position values and whether the above properties are +// active or not for each. +const POSITIONS = [ + { position: "unset", isActive: false }, + { position: "initial", isActive: false }, + { position: "inherit", isActive: false }, + { position: "static", isActive: false }, + { position: "absolute", isActive: true }, + { position: "relative", isActive: true }, + { position: "fixed", isActive: true }, + { position: "sticky", isActive: true }, +]; + +function makeTestCase(property, value, position, isActive) { + return { + info: `${property} is ${ + isActive ? "" : "in" + }active when position is ${position}`, + property, + tagName: "div", + rules: [`div { ${property}: ${value}; position: ${position}; }`], + isActive, + }; +} + +// Make the test cases for all the combinations of PROPERTIES and POSITIONS +const mainTests = []; + +for (const { property, value } of PROPERTIES) { + for (const { position, isActive } of POSITIONS) { + mainTests.push(makeTestCase(property, value, position, isActive)); + } +} + +// Add a few test cases to check that z-index actually works inside grids and flexboxes. +mainTests.push({ + info: "z-index is active even on unpositioned elements if they are grid items", + property: "z-index", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: grid; }", "span { z-index: 3; }"], + ruleIndex: 1, + isActive: true, +}); + +mainTests.push({ + info: "z-index is active even on unpositioned elements if they are flex items", + property: "z-index", + createTestElement: rootNode => { + const container = document.createElement("div"); + const element = document.createElement("span"); + container.append(element); + rootNode.append(container); + return element; + }, + rules: ["div { display: flex; }", "span { z-index: 3; }"], + ruleIndex: 1, + isActive: true, +}); + +export default mainTests; diff --git a/devtools/server/tests/chrome/inactive-property-helper/scroll-padding.mjs b/devtools/server/tests/chrome/inactive-property-helper/scroll-padding.mjs new file mode 100644 index 0000000000..acb2899be2 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/scroll-padding.mjs @@ -0,0 +1,159 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `scroll-padding-*` test cases. + +export default [ + { + info: "scroll-padding is active on element with auto-overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { overflow: auto; scroll-padding: 10px; }"], + isActive: true, + }, + { + info: "scroll-padding is active on element with scrollable overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { overflow: scroll; scroll-padding: 10px; }"], + isActive: true, + }, + { + info: "scroll-padding is active on element with hidden overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { overflow: hidden; scroll-padding: 10px; }"], + isActive: true, + }, + { + info: "scroll-padding is inactive on element with visible overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { scroll-padding: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding is inactive on element with clipped overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { overflow: clip; scroll-padding: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding is inactive on element with horizontally clipped overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { overflow-x: clip; scroll-padding: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding is inactive on element with vertically clipped overflow", + property: "scroll-padding", + tagName: "div", + rules: ["div { overflow-y: clip; scroll-padding: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-top is inactive on element with visible overflow", + property: "scroll-padding-top", + tagName: "div", + rules: ["div { scroll-padding-top: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-top is inactive on element with horizontally clipped overflow", + property: "scroll-padding-top", + tagName: "div", + rules: ["div { overflow-x: clip; scroll-padding-top: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-top is inactive on element with vertically clipped overflow", + property: "scroll-padding-top", + tagName: "div", + rules: ["div { overflow-y: clip; scroll-padding-top: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-top is active on element with horizontally clipped but vertical auto-overflow (as 'clip' is computed to 'hidden')", + property: "scroll-padding-top", + tagName: "div", + rules: [ + "div { overflow-x: clip; overflow-y: auto; scroll-padding-top: 10px; }", + ], + isActive: true, + }, + { + info: "scroll-padding-top is active on element with vertically clipped but horizontal auto-overflow (as 'clip' is computed to 'hidden')", + property: "scroll-padding-top", + tagName: "div", + rules: [ + "div { overflow-x: auto; overflow-y: clip; scroll-padding-top: 10px; }", + ], + isActive: true, + }, + { + info: "scroll-padding-right is inactive on element with visible overflow", + property: "scroll-padding-right", + tagName: "div", + rules: ["div { scroll-padding-right: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-bottom is inactive on element with visible overflow", + property: "scroll-padding-bottom", + tagName: "div", + rules: ["div { scroll-padding-bottom: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-left is inactive on element with visible overflow", + property: "scroll-padding-left", + tagName: "div", + rules: ["div { scroll-padding-left: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-block is inactive on element with visible overflow", + property: "scroll-padding-block", + tagName: "div", + rules: ["div { scroll-padding-block: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-block-end is inactive on element with visible overflow", + property: "scroll-padding-block-end", + tagName: "div", + rules: ["div { scroll-padding-block-end: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-block-start is inactive on element with visible overflow", + property: "scroll-padding-block-start", + tagName: "div", + rules: ["div { scroll-padding-block-start: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-inline is inactive on element with visible overflow", + property: "scroll-padding-inline", + tagName: "div", + rules: ["div { scroll-padding-inline: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-inline-end is inactive on element with visible overflow", + property: "scroll-padding-inline-end", + tagName: "div", + rules: ["div { scroll-padding-inline-end: 10px; }"], + isActive: false, + }, + { + info: "scroll-padding-inline-start is inactive on element with visible overflow", + property: "scroll-padding-inline-start", + tagName: "div", + rules: ["div { scroll-padding-inline-start: 10px; }"], + isActive: false, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/table-cell.mjs b/devtools/server/tests/chrome/inactive-property-helper/table-cell.mjs new file mode 100644 index 0000000000..bda1f27015 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/table-cell.mjs @@ -0,0 +1,21 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `empty-cells` test cases. +export default [ + { + info: "empty-cells is inactive on block element", + property: "empty-cells", + tagName: "div", + rules: ["div { empty-cells: hide; }"], + isActive: false, + }, + { + info: "empty-cells is active on table cell element", + property: "empty-cells", + tagName: "div", + rules: ["div { display: table-cell; empty-cells: hide; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/table.mjs b/devtools/server/tests/chrome/inactive-property-helper/table.mjs new file mode 100644 index 0000000000..596698522c --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/table.mjs @@ -0,0 +1,28 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `table-layout` test cases. +export default [ + { + info: "table-layout is inactive on block element", + property: "table-layout", + tagName: "div", + rules: ["div { table-layout: fixed; }"], + isActive: false, + }, + { + info: "table-layout is active on table element", + property: "table-layout", + tagName: "div", + rules: ["div { display: table; table-layout: fixed; }"], + isActive: true, + }, + { + info: "table-layout is active on inline table element", + property: "table-layout", + tagName: "div", + rules: ["div { display: inline-table; table-layout: fixed; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/text-overflow.mjs b/devtools/server/tests/chrome/inactive-property-helper/text-overflow.mjs new file mode 100644 index 0000000000..ada2211b3a --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/text-overflow.mjs @@ -0,0 +1,92 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `text-overflow` test cases. +export default [ + { + info: "text-overflow is inactive when overflow is not set", + property: "text-overflow", + tagName: "div", + rules: ["div { text-overflow: ellipsis; }"], + isActive: false, + }, + { + info: "text-overflow is active when overflow is set to hidden", + property: "text-overflow", + tagName: "div", + rules: ["div { text-overflow: ellipsis; overflow: hidden; }"], + isActive: true, + }, + { + info: "text-overflow is active when overflow is set to auto", + property: "text-overflow", + tagName: "div", + rules: ["div { text-overflow: ellipsis; overflow: auto; }"], + isActive: true, + }, + { + info: "text-overflow is active when overflow is set to scroll", + property: "text-overflow", + tagName: "div", + rules: ["div { text-overflow: ellipsis; overflow: scroll; }"], + isActive: true, + }, + { + info: "text-overflow is inactive when overflow is set to visible", + property: "text-overflow", + tagName: "div", + rules: ["div { text-overflow: ellipsis; overflow: visible; }"], + isActive: false, + }, + { + info: "text-overflow is active when overflow-x is set to hidden on horizontal writing mode", + property: "text-overflow", + tagName: "div", + rules: [ + "div { writing-mode: lr; text-overflow: ellipsis; overflow-x: hidden; }", + ], + isActive: true, + }, + { + info: "text-overflow is inactive when overflow-x is set to visible on horizontal writing mode", + property: "text-overflow", + tagName: "div", + rules: [ + "div { writing-mode: lr; text-overflow: ellipsis; overflow-x: visible; }", + ], + isActive: false, + }, + { + info: "text-overflow is active when overflow-y is set to hidden on vertical writing mode", + property: "text-overflow", + tagName: "div", + rules: [ + "div { writing-mode: vertical-lr; text-overflow: ellipsis; overflow-y: hidden; }", + ], + isActive: true, + }, + { + info: "text-overflow is inactive when overflow-y is set to visible on vertical writing mode", + property: "text-overflow", + tagName: "div", + rules: [ + "div { writing-mode: vertical-lr; text-overflow: ellipsis; overflow-y: visible; }", + ], + isActive: false, + }, + { + info: "as soon as overflow:hidden is set, text-overflow is active whatever the box type", + property: "text-overflow", + tagName: "span", + rules: ["span { text-overflow: ellipsis; overflow: hidden; }"], + isActive: true, + }, + { + info: "as soon as overflow:hidden is set, text-overflow is active whatever the box type", + property: "text-overflow", + tagName: "legend", + rules: ["legend { text-overflow: ellipsis; overflow: hidden; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/text-wrap.mjs b/devtools/server/tests/chrome/inactive-property-helper/text-wrap.mjs new file mode 100644 index 0000000000..58751aa764 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/text-wrap.mjs @@ -0,0 +1,86 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `text-wrap: balance` test cases. +const LOREM_IPSUM = ` + Lorem ipsum dolor sit amet, consectetur adipiscing elit. + Donec a diam lectus. Sed sit amet ipsum mauris. + Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. +`; + +export default [ + { + info: "text-wrap: balance; is inactive when line number exceeds threshold", + property: "text-wrap", + createTestElement: rootNode => { + const element = document.createElement("div"); + element.textContent = LOREM_IPSUM; + rootNode.append(element); + return element; + }, + tagName: "div", + rules: ["div { text-wrap: balance; width: 100px; }"], + isActive: false, + }, + { + info: "text-wrap: balance; is active when line number is below threshold", + property: "text-wrap", + createTestElement: rootNode => { + const element = document.createElement("div"); + element.textContent = LOREM_IPSUM; + rootNode.append(element); + return element; + }, + tagName: "div", + rules: ["div { text-wrap: balance; width: 300px; }"], + isActive: true, + }, + { + info: "text-wrap: balance is inactive when element is fragmented", + property: "text-wrap", + createTestElement: rootNode => { + const element = document.createElement("div"); + element.textContent = ` + Lorem ipsum dolor sit amet, consectetur adipiscing elit. + Donec a diam lectus. Sed sit amet ipsum mauris. + Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. + `; + rootNode.append(element); + return element; + }, + tagName: "div", + rules: ["div { text-wrap: balance; column-count: 2; }"], + isActive: false, + }, + { + info: "text-wrap: balance; does not throw if element is not a block", + property: "text-wrap", + createTestElement: rootNode => { + const element = document.createElement("div"); + element.textContent = LOREM_IPSUM; + rootNode.append(element); + return element; + }, + tagName: "div", + rules: ["div { text-wrap: balance; display: inline; }"], + isActive: true, + }, + { + info: "text-wrap: initial; is active", + property: "text-wrap", + createTestElement: rootNode => { + const element = document.createElement("div"); + element.textContent = ` + Lorem ipsum dolor sit amet, consectetur adipiscing elit. + Donec a diam lectus. Sed sit amet ipsum mauris. + Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. + `; + rootNode.append(element); + return element; + }, + tagName: "div", + rules: ["div { text-wrap: initial; width: 100px; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/vertical-align.mjs b/devtools/server/tests/chrome/inactive-property-helper/vertical-align.mjs new file mode 100644 index 0000000000..e9873d4865 --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/vertical-align.mjs @@ -0,0 +1,56 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `vertical-align` test cases. +export default [ + { + info: "vertical-align is inactive on a block element", + property: "vertical-align", + tagName: "div", + rules: ["div { vertical-align: top; }"], + isActive: false, + }, + { + info: "vertical-align is inactive on a span with display block", + property: "vertical-align", + tagName: "span", + rules: ["span { vertical-align: top; display: block;}"], + isActive: false, + }, + { + info: "vertical-align is active on a div with display inline-block", + property: "vertical-align", + tagName: "div", + rules: ["div { vertical-align: top; display: inline-block;}"], + isActive: true, + }, + { + info: "vertical-align is active on a table-cell", + property: "vertical-align", + tagName: "div", + rules: ["div { vertical-align: top; display: table-cell;}"], + isActive: true, + }, + { + info: "vertical-align is active on a block element ::first-letter", + property: "vertical-align", + tagName: "div", + rules: ["div::first-letter { vertical-align: top; }"], + isActive: true, + }, + { + info: "vertical-align is active on a block element ::first-line", + property: "vertical-align", + tagName: "div", + rules: ["div::first-line { vertical-align: top; }"], + isActive: true, + }, + { + info: "vertical-align is active on an inline element", + property: "vertical-align", + tagName: "span", + rules: ["span { vertical-align: top; }"], + isActive: true, + }, +]; diff --git a/devtools/server/tests/chrome/inactive-property-helper/width-height-ruby.mjs b/devtools/server/tests/chrome/inactive-property-helper/width-height-ruby.mjs new file mode 100644 index 0000000000..0dda222e0b --- /dev/null +++ b/devtools/server/tests/chrome/inactive-property-helper/width-height-ruby.mjs @@ -0,0 +1,147 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +// InactivePropertyHelper `width & height on ruby element` test cases. +export default [ + { + info: "width is inactive on ruby element", + property: "width", + tagName: "ruby", + rules: ["ruby { width: 10px; }"], + isActive: false, + }, + { + info: "min-width is inactive on ruby element", + property: "min-width", + tagName: "ruby", + rules: ["ruby { min-width: 10px; }"], + isActive: false, + }, + { + info: "max-width is inactive on ruby element", + property: "max-width", + tagName: "ruby", + rules: ["ruby { max-width: 10px; }"], + isActive: false, + }, + { + info: "height is inactive on ruby element", + property: "height", + tagName: "ruby", + rules: ["ruby { height: 10px; }"], + isActive: false, + }, + { + info: "min-height is inactive on ruby element", + property: "min-height", + tagName: "ruby", + rules: ["ruby { min-height: 10px; }"], + isActive: false, + }, + { + info: "max-height is inactive on ruby element", + property: "max-height", + tagName: "ruby", + rules: ["ruby { max-height: 10px; }"], + isActive: false, + }, + { + info: "width is active on div element", + property: "width", + tagName: "div", + rules: ["div { width: 10px; }"], + isActive: true, + }, + { + info: "min-width is active on div element", + property: "min-width", + tagName: "div", + rules: ["div { min-width: 10px; }"], + isActive: true, + }, + { + info: "max-width is active on div element", + property: "max-width", + tagName: "div", + rules: ["div { max-width: 10px; }"], + isActive: true, + }, + { + info: "height is active on div element", + property: "height", + tagName: "div", + rules: ["div { height: 10px; }"], + isActive: true, + }, + { + info: "min-height is active on div element", + property: "min-height", + tagName: "div", + rules: ["div { min-height: 10px; }"], + isActive: true, + }, + { + info: "max-height is active on div element", + property: "max-height", + tagName: "div", + rules: ["div { max-height: 10px; }"], + isActive: true, + }, + { + info: "width is inactive on div element with display ruby", + property: "width", + tagName: "div", + rules: ["div { width: 10px; display: ruby;}"], + isActive: false, + }, + { + info: "height is inactive on div element with display ruby", + property: "height", + tagName: "div", + rules: ["div { height: 10px; display: ruby;}"], + isActive: false, + }, + { + info: "width is active on ruby element with display block", + property: "width", + tagName: "ruby", + rules: ["ruby { width: 10px; display: block;}"], + isActive: true, + }, + { + info: "height is active on ruby element with display block", + property: "height", + tagName: "ruby", + rules: ["ruby { height: 10px; display: block;}"], + isActive: true, + }, + { + info: "width is inactive on ruby-text element", + property: "width", + tagName: "rt", + rules: ["rt { width: 10px;}"], + isActive: false, + }, + { + info: "height is inactive on ruby-text element", + property: "height", + tagName: "rt", + rules: ["rt { height: 10px;}"], + isActive: false, + }, + { + info: "width is inactive on div elements with display ruby-text", + property: "width", + tagName: "div", + rules: ["div { width: 10px; display: ruby-text;}"], + isActive: false, + }, + { + info: "height is inactive on div elements with display ruby-text", + property: "height", + tagName: "div", + rules: ["div { height: 10px; display: ruby-text;}"], + isActive: false, + }, +]; diff --git a/devtools/server/tests/chrome/inspector-delay-image-response.sjs b/devtools/server/tests/chrome/inspector-delay-image-response.sjs new file mode 100644 index 0000000000..633d7e3aa6 --- /dev/null +++ b/devtools/server/tests/chrome/inspector-delay-image-response.sjs @@ -0,0 +1,46 @@ +/** + * Adapted from https://searchfox.org/mozilla-central/source/layout/reftests/backgrounds/delay-image-response.sjs + */ +"use strict"; + +// A 1x1 PNG image. +// Source: https://commons.wikimedia.org/wiki/File:1x1.png (Public Domain) +const IMAGE = atob( + "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAA" + + "ACnej3aAAAAAXRSTlMAQObYZgAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII=" +); + +// To avoid GC. +let timer = null; + +function handleRequest(request, response) { + const query = {}; + request.queryString.split("&").forEach(function (val) { + const [name, value] = val.split("="); + query[name] = unescape(value); + }); + + response.setStatusLine(request.httpVersion, 200, "OK"); + response.setHeader("Content-Type", "image/png", false); + + // If there is no delay, we write the image and leave. + if (!("delay" in query)) { + response.write(IMAGE); + return; + } + + // If there is a delay, we create a timer which, when it fires, will write + // image and leave. + response.processAsync(); + const nsITimer = Ci.nsITimer; + + timer = Cc["@mozilla.org/timer;1"].createInstance(nsITimer); + timer.initWithCallback( + function () { + response.write(IMAGE); + response.finish(); + }, + query.delay, + nsITimer.TYPE_ONE_SHOT + ); +} diff --git a/devtools/server/tests/chrome/inspector-eyedropper.html b/devtools/server/tests/chrome/inspector-eyedropper.html new file mode 100644 index 0000000000..f5bd3a1cb8 --- /dev/null +++ b/devtools/server/tests/chrome/inspector-eyedropper.html @@ -0,0 +1,20 @@ + + + + Inspector Eyedropper tests + + + + + + diff --git a/devtools/server/tests/chrome/inspector-helpers.js b/devtools/server/tests/chrome/inspector-helpers.js new file mode 100644 index 0000000000..0b7edd8035 --- /dev/null +++ b/devtools/server/tests/chrome/inspector-helpers.js @@ -0,0 +1,133 @@ +/* exported attachURL, promiseDone, + promiseOnce, + addTest, addAsyncTest, + runNextTest, _documentWalker */ +"use strict"; + +const { require } = ChromeUtils.importESModule( + "resource://devtools/shared/loader/Loader.sys.mjs" +); +const { + CommandsFactory, +} = require("resource://devtools/shared/commands/commands-factory.js"); +const { + DevToolsServer, +} = require("resource://devtools/server/devtools-server.js"); +const { BrowserTestUtils } = ChromeUtils.importESModule( + "resource://testing-common/BrowserTestUtils.sys.mjs" +); +const { + DocumentWalker: _documentWalker, +} = require("resource://devtools/server/actors/inspector/document-walker.js"); + +// Always log packets when running tests. +Services.prefs.setBoolPref("devtools.debugger.log", true); +SimpleTest.registerCleanupFunction(function () { + Services.prefs.clearUserPref("devtools.debugger.log"); +}); + +if (!DevToolsServer.initialized) { + DevToolsServer.init(); + DevToolsServer.registerAllActors(); + SimpleTest.registerCleanupFunction(function () { + DevToolsServer.destroy(); + }); +} + +var gAttachCleanups = []; + +SimpleTest.registerCleanupFunction(function () { + for (const cleanup of gAttachCleanups) { + cleanup(); + } +}); + +/** + * Open a tab, load the url, wait for it to signal its readiness, + * connect to this tab via DevTools protocol and return. + * + * Returns an object with a few helpful attributes: + * - commands {Object}: The commands object defined by modules from devtools/shared/commands + * - target {TargetFront}: The current top-level target front. + * - doc {HtmlDocument}: the tab's document that got opened + */ +async function attachURL(url) { + // Get the current browser window + const gBrowser = + Services.wm.getMostRecentWindow("navigator:browser").gBrowser; + + // open the url in a new tab, save a reference to the new inner window global object + // and wait for it to load. The tests rely on this window object to send a "ready" + // event to its opener (the test page). This window reference is used within + // the test tab, to reference the webpage being tested against, which is in another + // tab. + const windowOpened = BrowserTestUtils.waitForNewTab(gBrowser, url); + const win = window.open(url, "_blank"); + await windowOpened; + + const commands = await CommandsFactory.forTab(gBrowser.selectedTab); + await commands.targetCommand.startListening(); + + const cleanup = async function () { + await commands.destroy(); + if (win) { + win.close(); + } + }; + + gAttachCleanups.push(cleanup); + return { + commands, + target: commands.targetCommand.targetFront, + doc: win.document, + }; +} + +function promiseOnce(target, event) { + return new Promise(resolve => { + target.on(event, (...args) => { + if (args.length === 1) { + resolve(args[0]); + } else { + resolve(args); + } + }); + }); +} + +function promiseDone(currentPromise) { + currentPromise.catch(err => { + ok(false, "Promise failed: " + err); + if (err.stack) { + dump(err.stack); + } + SimpleTest.finish(); + }); +} + +var _tests = []; +function addTest(test) { + _tests.push(test); +} + +function addAsyncTest(generator) { + _tests.push(() => generator().catch(ok.bind(null, false))); +} + +function runNextTest() { + if (!_tests.length) { + SimpleTest.finish(); + return; + } + const fn = _tests.shift(); + try { + fn(); + } catch (ex) { + info( + "Test function " + + (fn.name ? "'" + fn.name + "' " : "") + + "threw an exception: " + + ex + ); + } +} diff --git a/devtools/server/tests/chrome/inspector-search-data.html b/devtools/server/tests/chrome/inspector-search-data.html new file mode 100644 index 0000000000..784dcb7c9b --- /dev/null +++ b/devtools/server/tests/chrome/inspector-search-data.html @@ -0,0 +1,54 @@ + + + + Inspector Search Test Data + + + + + + + + +

Heading 1

+

A p tag with the text 'h1' inside of it. + A strong h1 result +

+ +
+ Unicode arrows +
+ +

Heading 2

+

Heading 2

+

Heading 2

+ +

Heading 3

+

Heading 3

+

Heading 3

+ +

Heading 4

+

Heading 4

+

Heading 4

+ +
+ + diff --git a/devtools/server/tests/chrome/inspector-styles-data.css b/devtools/server/tests/chrome/inspector-styles-data.css new file mode 100644 index 0000000000..5c3652f522 --- /dev/null +++ b/devtools/server/tests/chrome/inspector-styles-data.css @@ -0,0 +1,3 @@ +.external-rule { + cursor: crosshair; +} diff --git a/devtools/server/tests/chrome/inspector-styles-data.html b/devtools/server/tests/chrome/inspector-styles-data.html new file mode 100644 index 0000000000..334b268bfd --- /dev/null +++ b/devtools/server/tests/chrome/inspector-styles-data.html @@ -0,0 +1,85 @@ + + + + + +

Style Actor Tests

+ +
+
+
+
+
+ Here is the test node. +
+
+
+
+
+ + +
+
+ Here is the test node. +
+
+ + +
+
+ Here is the test node. +
+
+ +
+ Screen mediaqueried. +
+ +
+ +
+ +
I can has layout
+
I can has layout too
+ + + diff --git a/devtools/server/tests/chrome/inspector-template.html b/devtools/server/tests/chrome/inspector-template.html new file mode 100644 index 0000000000..13c9d5c7d3 --- /dev/null +++ b/devtools/server/tests/chrome/inspector-template.html @@ -0,0 +1,17 @@ + + + +
+ + + diff --git a/devtools/server/tests/chrome/inspector-traversal-data.html b/devtools/server/tests/chrome/inspector-traversal-data.html new file mode 100644 index 0000000000..e294796467 --- /dev/null +++ b/devtools/server/tests/chrome/inspector-traversal-data.html @@ -0,0 +1,103 @@ + + + + + Inspector Traversal Test Data + + + + +

Inspector Actor Tests

+ longlonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglong + short + +
+
a
+
b
+
c
+
d
+
e
+
f
+
g
+
h
+
i
+
j
+
k
+
l
+
m
+
n
+
o
+
p
+
q
+
r
+
s
+
t
+
u
+
v
+
w
+
x
+
y
+
z
+
+
+
+
+

+ + +
middle
+
+
light dom
+ +
+
+
+
scroll
+ + diff --git a/devtools/server/tests/chrome/inspector_css-properties.html b/devtools/server/tests/chrome/inspector_css-properties.html new file mode 100644 index 0000000000..8cc6368cd1 --- /dev/null +++ b/devtools/server/tests/chrome/inspector_css-properties.html @@ -0,0 +1,12 @@ + + + + + + diff --git a/devtools/server/tests/chrome/inspector_display-type.html b/devtools/server/tests/chrome/inspector_display-type.html new file mode 100644 index 0000000000..7bd0da6709 --- /dev/null +++ b/devtools/server/tests/chrome/inspector_display-type.html @@ -0,0 +1,17 @@ + + + +
+ HELLO WORLD +
+
+
+ + + diff --git a/devtools/server/tests/chrome/inspector_getImageData.html b/devtools/server/tests/chrome/inspector_getImageData.html new file mode 100644 index 0000000000..754798df44 --- /dev/null +++ b/devtools/server/tests/chrome/inspector_getImageData.html @@ -0,0 +1,23 @@ + + + + + + + + + + + diff --git a/devtools/server/tests/chrome/inspector_getOffsetParent.html b/devtools/server/tests/chrome/inspector_getOffsetParent.html new file mode 100644 index 0000000000..72aac5f70b --- /dev/null +++ b/devtools/server/tests/chrome/inspector_getOffsetParent.html @@ -0,0 +1,18 @@ + + + +
+
+
+
+
+
+ + + diff --git a/devtools/server/tests/chrome/large-image.jpg b/devtools/server/tests/chrome/large-image.jpg new file mode 100644 index 0000000000..bda383e594 Binary files /dev/null and b/devtools/server/tests/chrome/large-image.jpg differ diff --git a/devtools/server/tests/chrome/memory-helpers.js b/devtools/server/tests/chrome/memory-helpers.js new file mode 100644 index 0000000000..e4db689134 --- /dev/null +++ b/devtools/server/tests/chrome/memory-helpers.js @@ -0,0 +1,72 @@ +/* exported Task, startServerAndGetSelectedTabMemory, destroyServerAndFinish, + waitForTime, waitUntil */ +"use strict"; + +const { require } = ChromeUtils.importESModule( + "resource://devtools/shared/loader/Loader.sys.mjs" +); +const { + CommandsFactory, +} = require("resource://devtools/shared/commands/commands-factory.js"); + +// Always log packets when running tests. +Services.prefs.setBoolPref("devtools.debugger.log", true); +var gReduceTimePrecision = Services.prefs.getBoolPref( + "privacy.reduceTimerPrecision" +); +Services.prefs.setBoolPref("privacy.reduceTimerPrecision", false); +SimpleTest.registerCleanupFunction(function () { + Services.prefs.clearUserPref("devtools.debugger.log"); + Services.prefs.setBoolPref( + "privacy.reduceTimerPrecision", + gReduceTimePrecision + ); +}); + +async function getTargetForSelectedTab() { + const browserWindow = Services.wm.getMostRecentWindow("navigator:browser"); + const commands = await CommandsFactory.forTab( + browserWindow.gBrowser.selectedTab + ); + await commands.targetCommand.startListening(); + const isEveryFrameTargetEnabled = Services.prefs.getBoolPref( + "devtools.every-frame-target.enabled", + false + ); + if (!isEveryFrameTargetEnabled) { + return commands.targetCommand.targetFront; + } + + // If EFT is enabled, we need to retrieve the target of the test document + const targets = await commands.targetCommand.getAllTargets([ + commands.targetCommand.TYPES.FRAME, + ]); + + return targets.find(t => t.url !== "chrome://mochikit/content/harness.xhtml"); +} + +async function startServerAndGetSelectedTabMemory() { + const target = await getTargetForSelectedTab(); + const memory = await target.getFront("memory"); + return { memory, target }; +} + +async function destroyServerAndFinish(target) { + await target.destroy(); + SimpleTest.finish(); +} + +function waitForTime(ms) { + return new Promise((resolve, reject) => { + setTimeout(resolve, ms); + }); +} + +function waitUntil(predicate) { + if (predicate()) { + return Promise.resolve(true); + } + return new Promise(resolve => + setTimeout(() => waitUntil(predicate).then(() => resolve(true)), 10) + ); +} diff --git a/devtools/server/tests/chrome/nonchrome_unsafeDereference.html b/devtools/server/tests/chrome/nonchrome_unsafeDereference.html new file mode 100644 index 0000000000..15e9fd9160 --- /dev/null +++ b/devtools/server/tests/chrome/nonchrome_unsafeDereference.html @@ -0,0 +1,10 @@ + + + + diff --git a/devtools/server/tests/chrome/small-image.gif b/devtools/server/tests/chrome/small-image.gif new file mode 100644 index 0000000000..e702427a53 Binary files /dev/null and b/devtools/server/tests/chrome/small-image.gif differ diff --git a/devtools/server/tests/chrome/suspendTimeouts_content.html b/devtools/server/tests/chrome/suspendTimeouts_content.html new file mode 100644 index 0000000000..f3969fc10c --- /dev/null +++ b/devtools/server/tests/chrome/suspendTimeouts_content.html @@ -0,0 +1 @@ + diff --git a/devtools/server/tests/chrome/suspendTimeouts_content.js b/devtools/server/tests/chrome/suspendTimeouts_content.js new file mode 100644 index 0000000000..cb41653cff --- /dev/null +++ b/devtools/server/tests/chrome/suspendTimeouts_content.js @@ -0,0 +1,75 @@ +"use strict"; + +// To make it easier to follow, this code is arranged so that the functions are +// arranged in the order they are called. + +const worker = new Worker("suspendTimeouts_worker.js"); +worker.onerror = error => { + const message = `error from worker: ${error.filename}:${error.lineno}: ${error.message}`; + throw new Error(message); +}; + +// Create a message channel. Send one end to the worker, and return the other to +// the mochitest. +/* exported create_channel */ +function create_channel() { + const { port1, port2 } = new MessageChannel(); + info(`sending port to worker`); + worker.postMessage({ mochitestPort: port1 }, [port1]); + return port2; +} + +// Provoke the worker into sending us a message, and then refuse to receive said +// message, causing it to be delayed for later delivery. +// +// The worker will also post a message to the MessagePort we sent it earlier. +// That message should not be delayed, as it is handled by the mochitest window, +// not the content window. Its receipt signals that the test can assume that the +// runnable for step 2) is in the main thread's event queue, so the test can +// prepare for step 3). +/* exported start_worker */ +function start_worker() { + worker.onmessage = handle_echo; + + // This should prevent worker.onmessage from being called, until + // resumeTimeouts is called. + // + // This function is provided by test_suspendTimeouts.js. + // eslint-disable-next-line no-undef + suspendTimeouts(); + + // The worker should echo this message back to us and to the mochitest. + worker.postMessage("HALLOOOOOO"); // suitable message for echoing + info(`posted message to worker`); +} + +var resumeTimeouts_has_returned = false; + +// Resume timeouts. After this call, the worker's message should not be +// delivered to our onmessage handler until control returns to the event loop. +/* exported resume_timeouts */ +function resume_timeouts() { + // This function is provided by test_suspendTimeouts.js. + // eslint-disable-next-line no-undef + resumeTimeouts(); // onmessage handlers should not run from this call. + + resumeTimeouts_has_returned = true; + + // When this JavaScript invocation returns to the main thread's event loop, + // only then should onmessage handlers be invoked. +} + +// The buggy code calls this handler from the resumeTimeouts call, before the +// main thread returns to the event loop. The correct code calls this only once +// the JavaScript invocation that called resumeTimeouts has run to completion. +function handle_echo({ data }) { + ok( + resumeTimeouts_has_returned, + "worker message delivered from main event loop" + ); + + // Finish the mochitest. + // This function is set and defined by test_suspendTimeouts.js + // eslint-disable-next-line no-undef + finish(); +} diff --git a/devtools/server/tests/chrome/suspendTimeouts_worker.js b/devtools/server/tests/chrome/suspendTimeouts_worker.js new file mode 100644 index 0000000000..e008f7d0d3 --- /dev/null +++ b/devtools/server/tests/chrome/suspendTimeouts_worker.js @@ -0,0 +1,12 @@ +"use strict"; + +// Once content sends us a port connected to the mochitest, we simply echo every +// message we receive back to content and the mochitest. +onmessage = ({ data: { mochitestPort } }) => { + onmessage = ({ data }) => { + // Send a message to both content and the mochitest, which the main thread's + // event loop will attempt to deliver as step 2). + postMessage(`worker echo to content: ${data}`); + mochitestPort.postMessage(`worker echo to port: ${data}`); + }; +}; diff --git a/devtools/server/tests/chrome/test_Debugger.Script.prototype.global.html b/devtools/server/tests/chrome/test_Debugger.Script.prototype.global.html new file mode 100644 index 0000000000..d403d6b4a3 --- /dev/null +++ b/devtools/server/tests/chrome/test_Debugger.Script.prototype.global.html @@ -0,0 +1,48 @@ + + + + + + Debugger.Script.prototype.global should return inner windows + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_Debugger.Source.prototype.elementAttribute.html b/devtools/server/tests/chrome/test_Debugger.Source.prototype.elementAttribute.html new file mode 100644 index 0000000000..cb9c2bbcdc --- /dev/null +++ b/devtools/server/tests/chrome/test_Debugger.Source.prototype.elementAttribute.html @@ -0,0 +1,159 @@ + + + + + + Debugger.Source.prototype.element should return owning element + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionScript.html b/devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionScript.html new file mode 100644 index 0000000000..09c23b5253 --- /dev/null +++ b/devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionScript.html @@ -0,0 +1,96 @@ + + + + + + Debugger.Source.prototype.introductionScript with no caller + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionType.html b/devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionType.html new file mode 100644 index 0000000000..1057d4b94f --- /dev/null +++ b/devtools/server/tests/chrome/test_Debugger.Source.prototype.introductionType.html @@ -0,0 +1,159 @@ + + + + + + Debugger.Source.prototype.introductionType should identify event handlers + + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_animation-type-longhand.html b/devtools/server/tests/chrome/test_animation-type-longhand.html new file mode 100644 index 0000000000..97f5b1e469 --- /dev/null +++ b/devtools/server/tests/chrome/test_animation-type-longhand.html @@ -0,0 +1,42 @@ + + +Test animation-type-longhand + + + + diff --git a/devtools/server/tests/chrome/test_css-logic-specificity.html b/devtools/server/tests/chrome/test_css-logic-specificity.html new file mode 100644 index 0000000000..b5d5c76c0c --- /dev/null +++ b/devtools/server/tests/chrome/test_css-logic-specificity.html @@ -0,0 +1,84 @@ + + + + +Test css-logic specificity + + + + + diff --git a/devtools/server/tests/chrome/test_css-logic.html b/devtools/server/tests/chrome/test_css-logic.html new file mode 100644 index 0000000000..6378f5a9e7 --- /dev/null +++ b/devtools/server/tests/chrome/test_css-logic.html @@ -0,0 +1,73 @@ + + + + + + Test for Bug + + + + + + + + +
+ + diff --git a/devtools/server/tests/chrome/test_css-properties.html b/devtools/server/tests/chrome/test_css-properties.html new file mode 100644 index 0000000000..3cbc3a4aa7 --- /dev/null +++ b/devtools/server/tests/chrome/test_css-properties.html @@ -0,0 +1,72 @@ + + + + + + Test CSS Properties Actor + + + + + + + Mozilla Bug 1265798 + Test Document + + diff --git a/devtools/server/tests/chrome/test_device.html b/devtools/server/tests/chrome/test_device.html new file mode 100644 index 0000000000..117e50b5ca --- /dev/null +++ b/devtools/server/tests/chrome/test_device.html @@ -0,0 +1,79 @@ + + + + + + Mozilla Bug + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_executeInGlobal-outerized_this.html b/devtools/server/tests/chrome/test_executeInGlobal-outerized_this.html new file mode 100644 index 0000000000..6a846596b2 --- /dev/null +++ b/devtools/server/tests/chrome/test_executeInGlobal-outerized_this.html @@ -0,0 +1,73 @@ + + + + + + Mozilla Bug 837060 + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_highlighter_paused_debugger.html b/devtools/server/tests/chrome/test_highlighter_paused_debugger.html new file mode 100644 index 0000000000..82dc939dd6 --- /dev/null +++ b/devtools/server/tests/chrome/test_highlighter_paused_debugger.html @@ -0,0 +1,88 @@ + + + + + + PausedDebuggerOverlay test + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-changeattrs.html b/devtools/server/tests/chrome/test_inspector-changeattrs.html new file mode 100644 index 0000000000..94c4c3dc1b --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-changeattrs.html @@ -0,0 +1,90 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-changevalue.html b/devtools/server/tests/chrome/test_inspector-changevalue.html new file mode 100644 index 0000000000..f5aee52881 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-changevalue.html @@ -0,0 +1,68 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-display-type.html b/devtools/server/tests/chrome/test_inspector-display-type.html new file mode 100644 index 0000000000..a8bbedc22a --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-display-type.html @@ -0,0 +1,81 @@ + + + + + + Test for Bug 1431900 + + + + + + + +Mozilla Bug 1431900 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-duplicate-node.html b/devtools/server/tests/chrome/test_inspector-duplicate-node.html new file mode 100644 index 0000000000..205e11629e --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-duplicate-node.html @@ -0,0 +1,61 @@ + + + + + + Test for Bug 1208864 + + + + + + + +Mozilla Bug 1208864 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-hide.html b/devtools/server/tests/chrome/test_inspector-hide.html new file mode 100644 index 0000000000..e699400ee0 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-hide.html @@ -0,0 +1,71 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-inactive-property-helper.html b/devtools/server/tests/chrome/test_inspector-inactive-property-helper.html new file mode 100644 index 0000000000..86c783c035 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-inactive-property-helper.html @@ -0,0 +1,124 @@ + + + + + Test for InactivePropertyHelper + + + + + + diff --git a/devtools/server/tests/chrome/test_inspector-mutations-attr.html b/devtools/server/tests/chrome/test_inspector-mutations-attr.html new file mode 100644 index 0000000000..9430db65bd --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-mutations-attr.html @@ -0,0 +1,169 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-mutations-events.html b/devtools/server/tests/chrome/test_inspector-mutations-events.html new file mode 100644 index 0000000000..b48952c4d9 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-mutations-events.html @@ -0,0 +1,187 @@ + + + + + + Test for Bug 1157469 + + + + + + +Mozilla Bug 1157469 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-mutations-value.html b/devtools/server/tests/chrome/test_inspector-mutations-value.html new file mode 100644 index 0000000000..14e93b9d1c --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-mutations-value.html @@ -0,0 +1,163 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-pick-color.html b/devtools/server/tests/chrome/test_inspector-pick-color.html new file mode 100644 index 0000000000..74aa3c50ce --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-pick-color.html @@ -0,0 +1,94 @@ + + + + + + Test for Bug 1262439 + + + + + + +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-pseudoclass-lock.html b/devtools/server/tests/chrome/test_inspector-pseudoclass-lock.html new file mode 100644 index 0000000000..949066255d --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-pseudoclass-lock.html @@ -0,0 +1,185 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-reload.html b/devtools/server/tests/chrome/test_inspector-reload.html new file mode 100644 index 0000000000..09bd31cf75 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-reload.html @@ -0,0 +1,90 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-resize.html b/devtools/server/tests/chrome/test_inspector-resize.html new file mode 100644 index 0000000000..e0cf9abade --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-resize.html @@ -0,0 +1,69 @@ + + + + + + Test for Bug 1222409 + + + + + + +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-resolve-url.html b/devtools/server/tests/chrome/test_inspector-resolve-url.html new file mode 100644 index 0000000000..ddf68f56ed --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-resolve-url.html @@ -0,0 +1,87 @@ + + + + + + Test for Bug 921102 + + + + + + + +Mozilla Bug 921102 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-scroll-into-view.html b/devtools/server/tests/chrome/test_inspector-scroll-into-view.html new file mode 100644 index 0000000000..a107f9ba4a --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-scroll-into-view.html @@ -0,0 +1,60 @@ + + + + + + Test for Bug 901250 + + + + + + + +Mozilla Bug 901250 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-search-front.html b/devtools/server/tests/chrome/test_inspector-search-front.html new file mode 100644 index 0000000000..a78700e8e6 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-search-front.html @@ -0,0 +1,163 @@ + + + + + + Test for Bug 835896 + + + + + + +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector-template.html b/devtools/server/tests/chrome/test_inspector-template.html new file mode 100644 index 0000000000..6fbc7742c6 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector-template.html @@ -0,0 +1,66 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector_getImageData-wait-for-load.html b/devtools/server/tests/chrome/test_inspector_getImageData-wait-for-load.html new file mode 100644 index 0000000000..129116b913 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector_getImageData-wait-for-load.html @@ -0,0 +1,133 @@ + + + + + + Test for Bug 1192536 + + + + + + + +Mozilla Bug 1192536 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector_getImageData.html b/devtools/server/tests/chrome/test_inspector_getImageData.html new file mode 100644 index 0000000000..d95b0e5fd3 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector_getImageData.html @@ -0,0 +1,142 @@ + + + + + + Test for Bug 932937 + + + + + + + +Mozilla Bug 932937 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector_getImageDataFromURL.html b/devtools/server/tests/chrome/test_inspector_getImageDataFromURL.html new file mode 100644 index 0000000000..451c49dcc3 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector_getImageDataFromURL.html @@ -0,0 +1,116 @@ + + + + + + Test for Bug 1192536 + + + + + + + +Mozilla Bug 1192536 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector_getNodeFromActor.html b/devtools/server/tests/chrome/test_inspector_getNodeFromActor.html new file mode 100644 index 0000000000..c3c5d32af9 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector_getNodeFromActor.html @@ -0,0 +1,84 @@ + + + + + + Test for Bug 1155653 + + + + + + + +Mozilla Bug 1155653 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_inspector_getOffsetParent.html b/devtools/server/tests/chrome/test_inspector_getOffsetParent.html new file mode 100644 index 0000000000..09da7d55d1 --- /dev/null +++ b/devtools/server/tests/chrome/test_inspector_getOffsetParent.html @@ -0,0 +1,129 @@ + + + + + + Test for Bug 1345119 + + + + + + + +Mozilla Bug 1345119 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_makeGlobalObjectReference.html b/devtools/server/tests/chrome/test_makeGlobalObjectReference.html new file mode 100644 index 0000000000..d800798427 --- /dev/null +++ b/devtools/server/tests/chrome/test_makeGlobalObjectReference.html @@ -0,0 +1,96 @@ + + + + + + Mozilla Bug 914405 + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory.html b/devtools/server/tests/chrome/test_memory.html new file mode 100644 index 0000000000..79ba29c913 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory.html @@ -0,0 +1,39 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_allocations_02.html b/devtools/server/tests/chrome/test_memory_allocations_02.html new file mode 100644 index 0000000000..632903bc04 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_allocations_02.html @@ -0,0 +1,80 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_allocations_03.html b/devtools/server/tests/chrome/test_memory_allocations_03.html new file mode 100644 index 0000000000..ca6a1ec1b4 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_allocations_03.html @@ -0,0 +1,80 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_allocations_04.html b/devtools/server/tests/chrome/test_memory_allocations_04.html new file mode 100644 index 0000000000..8bb64c591c --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_allocations_04.html @@ -0,0 +1,62 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_allocations_05.html b/devtools/server/tests/chrome/test_memory_allocations_05.html new file mode 100644 index 0000000000..590b3358e4 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_allocations_05.html @@ -0,0 +1,93 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_allocations_06.html b/devtools/server/tests/chrome/test_memory_allocations_06.html new file mode 100644 index 0000000000..d6223dd062 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_allocations_06.html @@ -0,0 +1,51 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_allocations_07.html b/devtools/server/tests/chrome/test_memory_allocations_07.html new file mode 100644 index 0000000000..ce5ba4d2ad --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_allocations_07.html @@ -0,0 +1,58 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_attach_01.html b/devtools/server/tests/chrome/test_memory_attach_01.html new file mode 100644 index 0000000000..89f1818292 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_attach_01.html @@ -0,0 +1,33 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_attach_02.html b/devtools/server/tests/chrome/test_memory_attach_02.html new file mode 100644 index 0000000000..89e23f5ed6 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_attach_02.html @@ -0,0 +1,44 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_census.html b/devtools/server/tests/chrome/test_memory_census.html new file mode 100644 index 0000000000..3c351740d3 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_census.html @@ -0,0 +1,35 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_gc_01.html b/devtools/server/tests/chrome/test_memory_gc_01.html new file mode 100644 index 0000000000..8b2f049602 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_gc_01.html @@ -0,0 +1,50 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_memory_gc_events.html b/devtools/server/tests/chrome/test_memory_gc_events.html new file mode 100644 index 0000000000..5db1607c91 --- /dev/null +++ b/devtools/server/tests/chrome/test_memory_gc_events.html @@ -0,0 +1,44 @@ + + + + + + Memory monitoring actor test + + + + +
+
+
+
+ + diff --git a/devtools/server/tests/chrome/test_overflowing-body.html b/devtools/server/tests/chrome/test_overflowing-body.html new file mode 100644 index 0000000000..1fe52e0011 --- /dev/null +++ b/devtools/server/tests/chrome/test_overflowing-body.html @@ -0,0 +1,42 @@ + + + + + +Test InspectorUtils.GetOverflowingChildrenOfElement on the body element + + + + + +
+ + diff --git a/devtools/server/tests/chrome/test_overflowing-children.html b/devtools/server/tests/chrome/test_overflowing-children.html new file mode 100644 index 0000000000..8ba81bec3d --- /dev/null +++ b/devtools/server/tests/chrome/test_overflowing-children.html @@ -0,0 +1,131 @@ + + + + + +Test InspectorUtils.GetOverflowingChildrenOfElement + + + + + + + + + + + + + + + abcd + + + + abcd + + + + + abcd + + + + + + + + + + + + + + + abcd + + + + diff --git a/devtools/server/tests/chrome/test_preference.html b/devtools/server/tests/chrome/test_preference.html new file mode 100644 index 0000000000..b4d23a24aa --- /dev/null +++ b/devtools/server/tests/chrome/test_preference.html @@ -0,0 +1,128 @@ + + + + + + Test Preference Actor + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_styles-applied.html b/devtools/server/tests/chrome/test_styles-applied.html new file mode 100644 index 0000000000..0910e9d7bc --- /dev/null +++ b/devtools/server/tests/chrome/test_styles-applied.html @@ -0,0 +1,155 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_styles-computed.html b/devtools/server/tests/chrome/test_styles-computed.html new file mode 100644 index 0000000000..9aa962108a --- /dev/null +++ b/devtools/server/tests/chrome/test_styles-computed.html @@ -0,0 +1,130 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_styles-layout.html b/devtools/server/tests/chrome/test_styles-layout.html new file mode 100644 index 0000000000..f0441edd13 --- /dev/null +++ b/devtools/server/tests/chrome/test_styles-layout.html @@ -0,0 +1,110 @@ + + + + +Test for Bug 1175040 - PageStyleActor.getLayout + + + + + + +Mozilla Bug 1175040 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_styles-matched.html b/devtools/server/tests/chrome/test_styles-matched.html new file mode 100644 index 0000000000..42e1ec7885 --- /dev/null +++ b/devtools/server/tests/chrome/test_styles-matched.html @@ -0,0 +1,110 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_styles-modify.html b/devtools/server/tests/chrome/test_styles-modify.html new file mode 100644 index 0000000000..e615ec4425 --- /dev/null +++ b/devtools/server/tests/chrome/test_styles-modify.html @@ -0,0 +1,110 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_styles-svg.html b/devtools/server/tests/chrome/test_styles-svg.html new file mode 100644 index 0000000000..b03bc868b7 --- /dev/null +++ b/devtools/server/tests/chrome/test_styles-svg.html @@ -0,0 +1,61 @@ + + + + + + Test for Bug + + + + + + + +Mozilla Bug 921191 +Test Document +

+ +
+
+ + diff --git a/devtools/server/tests/chrome/test_suspendTimeouts.html b/devtools/server/tests/chrome/test_suspendTimeouts.html new file mode 100644 index 0000000000..65a168986f --- /dev/null +++ b/devtools/server/tests/chrome/test_suspendTimeouts.html @@ -0,0 +1,20 @@ + + + + + + Mozilla Bug 1426467 + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_suspendTimeouts.js b/devtools/server/tests/chrome/test_suspendTimeouts.js new file mode 100644 index 0000000000..614ac60cdb --- /dev/null +++ b/devtools/server/tests/chrome/test_suspendTimeouts.js @@ -0,0 +1,139 @@ +"use strict"; + +// The debugger uses nsIDOMWindowUtils::suspendTimeouts and ...::resumeTimeouts +// to ensure that content event handlers do not run while a JavaScript +// invocation is stepping or paused at a breakpoint. If a worker thread sends +// messages to the content while the content is paused, those messages must not +// run until the JavaScript invocation interrupted by the debugger has completed. +// +// Bug 1426467 is that calling nsIDOMWindowUtils::resumeTimeouts actually +// delivers deferred messages itself, calling the content's 'onmessage' handler. +// But the debugger calls suspend/resume around each individual interruption of +// the debuggee -- each step, say -- meaning that hitting the "step into" button +// causes you to step from the debuggee directly into an onmessage handler, +// since the onmessage handler is the next function call the debugger sees. +// +// In other words, delivering deferred messages from resumeTimeouts, as it is +// used by the debugger, breaks the run-to-completion rule. They must not be +// delivered until after the JavaScript invocation at hand is complete. That's +// what this test checks. +// +// For this test to detect the bug, the following steps must take place in +// order: +// +// 1) The content page must call suspendTimeouts. +// 2) A runnable conveying a message from the worker thread must attempt to +// deliver the message, see that the content page has suspended such things, +// and hold the message for later delivery. +// 3) The content page must call resumeTimeouts. +// +// In a correct implementation, the message from the worker thread is delivered +// only after the main thread returns to the event loop after calling +// resumeTimeouts in step 3). In the buggy implementation, the onmessage handler +// is called directly from the call to resumeTimeouts, so that the onmessage +// handlers run in the midst of whatever JavaScript invocation resumed timeouts +// (say, stepping in the debugger), in violation of the run-to-completion rule. +// +// In this specific bug, the handlers are called from resumeTimeouts, but +// really, running them any time before that invocation returns to the main +// event loop would be a bug. +// +// Posting the message and calling resumeTimeouts take place in different +// threads, but if 2) and 3) don't occur in that order, the worker's message +// will never be delayed and the test will pass spuriously. But the worker +// can't communicate with the content page directly, to let it know that it +// should proceed with step 3): the purpose of suspendTimeouts is to pause +// all such communication. +// +// So instead, the content page creates a MessageChannel, and passes one +// MessagePort to the worker and the other to this mochitest (which has its +// own window, separate from the one calling suspendTimeouts). The worker +// notifies the mochitest when it has posted the message, and then the +// mochitest calls into the content to carry out step 3). + +// To help you follow all the callbacks and event handlers, this code pulls out +// event handler functions so that control flows from top to bottom. + +window.onload = function () { + // This mochitest is not complete until we call SimpleTest.finish. Don't just + // exit as soon as we return to the main event loop. + SimpleTest.waitForExplicitFinish(); + + const iframe = document.createElement("iframe"); + iframe.src = + "http://mochi.test:8888/chrome/devtools/server/tests/chrome/suspendTimeouts_content.html"; + iframe.onload = iframe_onload_handler; + document.body.appendChild(iframe); + + function iframe_onload_handler() { + const content = iframe.contentWindow.wrappedJSObject; + + const windowUtils = iframe.contentWindow.windowUtils; + + // Hand over the suspend and resume functions to the content page, along + // with some testing utilities. + content.suspendTimeouts = function () { + SimpleTest.info("test_suspendTimeouts", "calling suspendTimeouts"); + windowUtils.suspendTimeouts(); + }; + content.resumeTimeouts = function () { + windowUtils.resumeTimeouts(); + SimpleTest.info("test_suspendTimeouts", "resumeTimeouts called"); + }; + content.info = function (message) { + SimpleTest.info("suspendTimeouts_content.js", message); + }; + content.ok = SimpleTest.ok; + content.finish = finish; + + SimpleTest.info( + "Disappointed with National Tautology Day? Well, it is what it is." + ); + + // Once the worker has sent a message to its parent (which should get delayed), + // it sends us a message directly on this channel. + const workerPort = content.create_channel(); + workerPort.onmessage = handle_worker_echo; + + // Have content send the worker a message that it should echo back to both + // content and us. The echo to content should get delayed; the echo to us + // should cause our handle_worker_echo to be called. + content.start_worker(); + + function handle_worker_echo({ data }) { + info(`mochitest received message from worker: ${data}`); + + // As it turns out, it's not correct to assume that, if the worker posts a + // message to its parent via the global `postMessage` function, and then + // posts a message to the mochitest via the MessagePort, those two + // messages will be delivered in the order they were sent. + // + // - Messages sent via the worker's global's postMessage go through two + // ThrottledEventQueues (one in the worker, and one on the parent), and + // eventually find their way into the thread's primary event queue, + // which is a PrioritizedEventQueue. + // + // - Messages sent via a MessageChannel whose ports are owned by different + // threads are passed as IPDL messages. + // + // There's basically no reliable way to ensure that delivery to content + // has been attempted and the runnable deferred; there are too many + // variables affecting the order in which things are processed. Delaying + // for a second is the best I could think of. + // + // Fortunately, this tactic failing can only cause spurious test passes + // (the runnable never gets deferred, so things work by accident), not + // spurious failures. Without some kind of trustworthy notification that + // the runnable has been deferred, perhaps via some special white-box + // testing API, we can't do better. + setTimeout(() => { + content.resume_timeouts(); + }, 1000); + } + + function finish(message) { + SimpleTest.info("suspendTimeouts_content.js", "called finish"); + SimpleTest.finish(); + } + } +}; diff --git a/devtools/server/tests/chrome/test_unsafeDereference.html b/devtools/server/tests/chrome/test_unsafeDereference.html new file mode 100644 index 0000000000..eca1e7d43e --- /dev/null +++ b/devtools/server/tests/chrome/test_unsafeDereference.html @@ -0,0 +1,53 @@ + + + + + + Mozilla Bug 837723 + + + + +
+
+
+ + diff --git a/devtools/server/tests/chrome/test_webconsole-node-grip.html b/devtools/server/tests/chrome/test_webconsole-node-grip.html new file mode 100644 index 0000000000..0c54f65964 --- /dev/null +++ b/devtools/server/tests/chrome/test_webconsole-node-grip.html @@ -0,0 +1,66 @@ + + + + + DOMNode Object actor test + + + + + + +

+ +
+  
+ + diff --git a/devtools/server/tests/chrome/webconsole-helpers.js b/devtools/server/tests/chrome/webconsole-helpers.js new file mode 100644 index 0000000000..8be8554e35 --- /dev/null +++ b/devtools/server/tests/chrome/webconsole-helpers.js @@ -0,0 +1,54 @@ +/* exported addTabAndCreateCommands */ +"use strict"; + +const { require } = ChromeUtils.importESModule( + "resource://devtools/shared/loader/Loader.sys.mjs" +); +const { + DevToolsServer, +} = require("resource://devtools/server/devtools-server.js"); +const { + CommandsFactory, +} = require("resource://devtools/shared/commands/commands-factory.js"); + +// Always log packets when running tests. +Services.prefs.setBoolPref("devtools.debugger.log", true); +SimpleTest.registerCleanupFunction(function () { + Services.prefs.clearUserPref("devtools.debugger.log"); +}); + +if (!DevToolsServer.initialized) { + DevToolsServer.init(); + DevToolsServer.registerAllActors(); + SimpleTest.registerCleanupFunction(function () { + DevToolsServer.destroy(); + }); +} + +/** + * Open a tab, load the url, find the tab with the devtools server, + * and attach the console to it. + * + * @param {string} url : url to navigate to + * @return {Promise} Promise resolving when commands are initialized + * The Promise resolves with the commands. + */ +async function addTabAndCreateCommands(url) { + const tab = await addTab(url); + const commands = await CommandsFactory.forTab(tab); + await commands.targetCommand.startListening(); + return commands; +} + +/** + * Naive implementaion of addTab working from a mochitest-chrome test. + */ +async function addTab(url) { + const { gBrowser } = Services.wm.getMostRecentWindow("navigator:browser"); + const { BrowserTestUtils } = ChromeUtils.importESModule( + "resource://testing-common/BrowserTestUtils.sys.mjs" + ); + const tab = (gBrowser.selectedTab = BrowserTestUtils.addTab(gBrowser, url)); + await BrowserTestUtils.browserLoaded(tab.linkedBrowser); + return tab; +} -- cgit v1.2.3