diff options
Diffstat (limited to '')
-rw-r--r-- | devtools/client/inspector/rules/test/browser_rules_class_panel_invalid_nodes.js | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/devtools/client/inspector/rules/test/browser_rules_class_panel_invalid_nodes.js b/devtools/client/inspector/rules/test/browser_rules_class_panel_invalid_nodes.js new file mode 100644 index 0000000000..24a0dfbcfc --- /dev/null +++ b/devtools/client/inspector/rules/test/browser_rules_class_panel_invalid_nodes.js @@ -0,0 +1,51 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Test the class panel shows a message when invalid nodes are selected. +// text nodes, pseudo-elements, DOCTYPE, comment nodes. + +add_task(async function () { + await addTab(`data:text/html;charset=utf-8, + <body> + <style>div::after {content: "test";}</style> + <!-- comment --> + Some text + <div></div> + </body>`); + + info("Open the class panel"); + const { inspector, view } = await openRuleView(); + view.showClassPanel(); + + info("Selecting the DOCTYPE node"); + const { nodes } = await inspector.walker.children(inspector.walker.rootNode); + await selectNode(nodes[0], inspector); + checkMessageIsDisplayed(view); + + info("Selecting the comment node"); + const styleNode = await getNodeFront("style", inspector); + const commentNode = await inspector.walker.nextSibling(styleNode); + await selectNode(commentNode, inspector); + checkMessageIsDisplayed(view); + + info("Selecting the text node"); + const textNode = await inspector.walker.nextSibling(commentNode); + await selectNode(textNode, inspector); + checkMessageIsDisplayed(view); + + info("Selecting the ::after pseudo-element"); + const divNode = await getNodeFront("div", inspector); + const pseudoElement = (await inspector.walker.children(divNode)).nodes[0]; + await selectNode(pseudoElement, inspector); + checkMessageIsDisplayed(view); +}); + +function checkMessageIsDisplayed(view) { + ok( + view.classListPreviewer.classesEl.querySelector(".no-classes"), + "The message is displayed" + ); + checkClassPanelContent(view, []); +} |