diff options
Diffstat (limited to 'devtools/client/accessibility/test/chrome')
8 files changed, 853 insertions, 0 deletions
diff --git a/devtools/client/accessibility/test/chrome/chrome.toml b/devtools/client/accessibility/test/chrome/chrome.toml new file mode 100644 index 0000000000..503e029d8e --- /dev/null +++ b/devtools/client/accessibility/test/chrome/chrome.toml @@ -0,0 +1,16 @@ +[DEFAULT] +support-files = [ + "head.js", + "contrast.snapshots.js", + "!/devtools/client/shared/components/test/chrome/head.js", +] + +["test_accessible_contrast.html"] + +["test_accessible_learnMoreLink.html"] + +["test_accessible_openLink.html"] + +["test_accessible_relations.html"] + +["test_accessible_row_context_menu.html"] diff --git a/devtools/client/accessibility/test/chrome/contrast.snapshots.js b/devtools/client/accessibility/test/chrome/contrast.snapshots.js new file mode 100644 index 0000000000..3b14ff8d66 --- /dev/null +++ b/devtools/client/accessibility/test/chrome/contrast.snapshots.js @@ -0,0 +1,262 @@ +/* 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/. */ +"use strict"; + +window._snapshots = { + "ColorContrastAccessibility error render.": { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-check", + }, + children: [ + { + type: "h3", + props: { + className: "accessibility-check-header", + }, + children: ["Color and Contrast"], + }, + { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-color-contrast", + }, + children: [ + { + type: "span", + props: { + className: "accessibility-color-contrast-error", + role: "presentation", + }, + children: ["Unable to calculate"], + }, + ], + }, + ], + }, + "ColorContrastAccessibility basic render.": { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-check", + }, + children: [ + { + type: "h3", + props: { + className: "accessibility-check-header", + }, + children: ["Color and Contrast"], + }, + { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-color-contrast", + }, + children: [ + { + type: "span", + props: { + className: "accessibility-contrast-value FAIL", + role: "presentation", + style: { + "--accessibility-contrast-color": "rgba(255,0,0,1)", + "--accessibility-contrast-bg": "rgba(255,255,255,1)", + }, + }, + children: ["4.00"], + }, + ], + }, + { + type: "p", + props: { + className: "accessibility-check-annotation", + }, + children: [ + "Does not meet WCAG standards for accessible text. ", + { + type: "a", + props: { + className: "link", + href: + "https://developer.mozilla.org/docs/Web/Accessibility/" + + "Understanding_WCAG/Perceivable/Color_contrast?utm_source=" + + "devtools&utm_medium=a11y-panel-checks-color-contrast", + onClick: + "openDocOnClick(event) {\n event.preventDefault();\n " + + "openDocLink(event.target.href);\n }", + }, + children: ["Learn more"], + }, + "", + ], + }, + ], + }, + "ColorContrastAccessibility range render.": { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-check", + }, + children: [ + { + type: "h3", + props: { + className: "accessibility-check-header", + }, + children: ["Color and Contrast"], + }, + { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-color-contrast", + }, + children: [ + { + type: "span", + props: { + className: "accessibility-contrast-value FAIL", + role: "presentation", + style: { + "--accessibility-contrast-color": "rgba(128,128,128,1)", + "--accessibility-contrast-bg": "rgba(219,106,116,1)", + }, + }, + children: ["1.19"], + }, + { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-color-contrast-separator", + }, + children: null, + }, + { + type: "span", + props: { + className: "accessibility-contrast-value FAIL", + role: "presentation", + style: { + "--accessibility-contrast-color": "rgba(128,128,128,1)", + "--accessibility-contrast-bg": "rgba(156,145,211,1)", + }, + }, + children: ["1.39"], + }, + ], + }, + { + type: "p", + props: { + className: "accessibility-check-annotation", + }, + children: [ + "Does not meet WCAG standards for accessible text. ", + { + type: "a", + props: { + className: "link", + href: + "https://developer.mozilla.org/docs/Web/Accessibility/" + + "Understanding_WCAG/Perceivable/Color_contrast?utm_source=" + + "devtools&utm_medium=a11y-panel-checks-color-contrast", + onClick: + "openDocOnClick(event) {\n event.preventDefault();\n " + + "openDocLink(event.target.href);\n }", + }, + children: ["Learn more"], + }, + "", + ], + }, + ], + }, + "ColorContrastAccessibility large text render.": { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-check", + }, + children: [ + { + type: "h3", + props: { + className: "accessibility-check-header", + }, + children: ["Color and Contrast"], + }, + { + type: "div", + props: { + role: "presentation", + tabIndex: "-1", + className: "accessibility-color-contrast", + }, + children: [ + { + type: "span", + props: { + className: "accessibility-contrast-value AA", + role: "presentation", + style: { + "--accessibility-contrast-color": "rgba(255,0,0,1)", + "--accessibility-contrast-bg": "rgba(255,255,255,1)", + }, + }, + children: ["4.00"], + }, + { + type: "span", + props: { + className: "accessibility-color-contrast-large-text", + role: "presentation", + title: + "Text is 14 point and bold or larger, or 18 point or larger.", + }, + children: ["large text"], + }, + ], + }, + { + type: "p", + props: { + className: "accessibility-check-annotation", + }, + children: [ + "Meets WCAG AA standards for accessible text. ", + { + type: "a", + props: { + className: "link", + href: + "https://developer.mozilla.org/docs/Web/Accessibility/" + + "Understanding_WCAG/Perceivable/Color_contrast?utm_source=" + + "devtools&utm_medium=a11y-panel-checks-color-contrast", + onClick: + "openDocOnClick(event) {\n event.preventDefault();\n " + + "openDocLink(event.target.href);\n }", + }, + children: ["Learn more"], + }, + "", + ], + }, + ], + }, +}; diff --git a/devtools/client/accessibility/test/chrome/head.js b/devtools/client/accessibility/test/chrome/head.js new file mode 100644 index 0000000000..a1a02df8a8 --- /dev/null +++ b/devtools/client/accessibility/test/chrome/head.js @@ -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/. */ +/* eslint no-unused-vars: [2, {"vars": "local"}] */ + +"use strict"; + +var { require } = ChromeUtils.importESModule( + "resource://devtools/shared/loader/Loader.sys.mjs" +); +var { BrowserLoader } = ChromeUtils.import( + "resource://devtools/shared/loader/browser-loader.js" +); +var DevToolsUtils = require("resource://devtools/shared/DevToolsUtils.js"); + +var { require: browserRequire } = BrowserLoader({ + baseURI: "resource://devtools/client/shared/", + window, +}); + +window.EVENTS = {}; +window.on = function () {}; +window.off = function () {}; + +SimpleTest.registerCleanupFunction(() => { + window.EVENTS = null; + window.on = null; + window.off = null; +}); + +// All tests are asynchronous. +SimpleTest.waitForExplicitFinish(); diff --git a/devtools/client/accessibility/test/chrome/test_accessible_contrast.html b/devtools/client/accessibility/test/chrome/test_accessible_contrast.html new file mode 100644 index 0000000000..aeb1cc47a5 --- /dev/null +++ b/devtools/client/accessibility/test/chrome/test_accessible_contrast.html @@ -0,0 +1,84 @@ +<!-- 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/. --> +<!DOCTYPE HTML> +<html> +<!-- +Test that Color Contrast component renders correctly. +--> +<head> + <meta charset="utf-8"> + <title>Color Contrast accessibility component test</title> + <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> + <link rel="stylesheet" href="chrome://devtools/skin/light-theme.css" type="text/css"> +</head> +<body> +<pre id="test"> +<script src="head.js" type="application/javascript"></script> +<script src="chrome://mochitests/content/chrome/devtools/client/shared/components/test/chrome/head.js" type="application/javascript"/> +<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js" type="application/javascript"></script> +<script src="contrast.snapshots.js" type="application/javascript"></script> +<script type="application/javascript"> + +"use strict"; + +/* global matchSnapshot */ + +window.onload = async function() { + try { + const React = browserRequire("devtools/client/shared/vendor/react"); + const { ColorContrastCheck } = browserRequire( + "devtools/client/accessibility/components/ColorContrastAccessibility"); + + const { + accessibility: { SCORES }, + } = browserRequire("devtools/shared/constants"); + + matchSnapshot("ColorContrastAccessibility error render.", + React.createElement(ColorContrastCheck, { error: true }) + ); + + matchSnapshot("ColorContrastAccessibility basic render.", + React.createElement(ColorContrastCheck, { + "value": 4.00, + "color": [255, 0, 0, 1], + "backgroundColor": [255, 255, 255, 1], + "isLargeText": false, + "score": SCORES.FAIL, + }) + ); + + matchSnapshot("ColorContrastAccessibility range render.", + React.createElement(ColorContrastCheck, { + "min": 1.19, + "max": 1.39, + "color": [128, 128, 128, 1], + "backgroundColorMin": [219, 106, 116, 1], + "backgroundColorMax": [156, 145, 211, 1], + "isLargeText": false, + "score": SCORES.FAIL, + "scoreMin": SCORES.FAIL, + "scoreMax": SCORES.FAIL, + }) + ); + + matchSnapshot("ColorContrastAccessibility large text render.", + React.createElement(ColorContrastCheck, { + "value": 4.00, + "color": [255, 0, 0, 1], + "backgroundColor": [255, 255, 255, 1], + "isLargeText": true, + "score": SCORES.AA, + }) + ); + } catch (e) { + ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e)); + } finally { + SimpleTest.finish(); + } +}; +</script> +</pre> +</body> +</html> diff --git a/devtools/client/accessibility/test/chrome/test_accessible_learnMoreLink.html b/devtools/client/accessibility/test/chrome/test_accessible_learnMoreLink.html new file mode 100644 index 0000000000..4644b21cd0 --- /dev/null +++ b/devtools/client/accessibility/test/chrome/test_accessible_learnMoreLink.html @@ -0,0 +1,97 @@ +<!-- 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/. --> +<!DOCTYPE HTML> +<html> +<!-- +Test that LearnMoreLink parses and renders correctly text with learn more links. +--> +<head> + <meta charset="utf-8"> + <title>LearnMoreLink component test</title> + <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> + <link rel="stylesheet" href="chrome://devtools/skin/light-theme.css" type="text/css"> +</head> +<body> +<pre id="test"> +<script src="head.js" type="application/javascript"></script> +<script type="application/javascript"> + +"use strict"; + +window.onload = async function() { + try { + const { gDevTools } = require("devtools/client/framework/devtools"); + const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom"); + const { createFactory } = browserRequire("devtools/client/shared/vendor/react"); + const { Simulate } = + browserRequire("devtools/client/shared/vendor/react-dom-test-utils"); + const LearnMoreLink = createFactory( + browserRequire("devtools/client/accessibility/components/LearnMoreLink")); + + class MockL10N { + constructor(bundle) { + this.bundle = bundle; + } + + getStr(name) { + return this.bundle[name]; + } + + getFormatStr(name, ...args) { + let index = 0; + return this.bundle[name].replace("%S", () => args[index++]); + } + } + + function testLinkClicked(link, expectedUrl) { + const browserWindow = Services.wm.getMostRecentWindow(gDevTools.chromeWindowType); + const defaultOpenWebLinkIn = browserWindow.openWebLinkIn; + + const checker = Symbol(); + let onClickUrl = checker; + browserWindow.openWebLinkIn = url => { + onClickUrl = url; + }; + + Simulate.click(link); + + ok(onClickUrl !== checker, "Link was clicked"); + is(onClickUrl, expectedUrl, "Correct URL is opened"); + + browserWindow.openWebLinkIn = defaultOpenWebLinkIn; + } + + const href = "http://example.com/"; + const className = "test-class"; + const l10n = new MockL10N({ + message: "This is a message that contains a link. %S", + link: "Learn more", + }); + const learnMoreLink = LearnMoreLink( + { href, className, l10n, learnMoreStringKey: "link", messageStringKey: "message" }); + ok(LearnMoreLink, "Should be able to create LearnMoreLink instances"); + + ReactDOM.render(learnMoreLink, document.body); + const p = document.querySelector("p"); + is(p.textContent, "This is a message that contains a link. Learn more", + "Text content for the whole paragraph is correct"); + + is(p.className, className, "Class name is set correctly."); + + const link = p.querySelector(".link"); + ok(link, "Link was rendered"); + is(link.textContent, "Learn more", "Text content for link is correct"); + + testLinkClicked(link, href); + } catch (e) { + ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e)); + } finally { + SimpleTest.finish(); + } +}; +</script> +</pre> +</body> +</html> diff --git a/devtools/client/accessibility/test/chrome/test_accessible_openLink.html b/devtools/client/accessibility/test/chrome/test_accessible_openLink.html new file mode 100644 index 0000000000..1ed351e2fb --- /dev/null +++ b/devtools/client/accessibility/test/chrome/test_accessible_openLink.html @@ -0,0 +1,111 @@ +<!-- 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/. --> +<!DOCTYPE HTML> +<html> +<!-- +Test that openLink function is called if accessible object property is rendered as a link. +--> +<head> + <meta charset="utf-8"> + <title>Accessible component test</title> + <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> + <link rel="stylesheet" href="chrome://devtools/skin/light-theme.css" type="text/css"> +</head> +<body> +<pre id="test"> +<script src="head.js" type="application/javascript"></script> +<script type="application/javascript"> + +"use strict"; + +window.onload = async function() { + try { + const { gDevTools } = require("devtools/client/framework/devtools"); + const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom"); + const { createFactory, createElement } = + browserRequire("devtools/client/shared/vendor/react"); + const { Provider } = require("devtools/client/shared/vendor/react-redux"); + const createStore = require("devtools/client/shared/redux/create-store"); + const { Simulate } = + browserRequire("devtools/client/shared/vendor/react-dom-test-utils"); + const Accessible = createFactory( + browserRequire("devtools/client/accessibility/components/Accessible")); + + function testLinkClicked(link, event, expectedUrl, expectedWhere) { + const browserWindow = Services.wm.getMostRecentWindow(gDevTools.chromeWindowType); + const defaultOpenWebLinkIn = browserWindow.openWebLinkIn; + + const checker = Symbol(); + let onClickArgs = checker; + browserWindow.openWebLinkIn = (url, where) => { + onClickArgs = { url, where }; + }; + + Simulate.click(link, event); + + ok(onClickArgs !== checker, "Link was clicked"); + is(onClickArgs.url, expectedUrl, "Correct URL is opened"); + is(onClickArgs.where, expectedWhere, "URL was opened correctly"); + + browserWindow.openWebLinkIn = defaultOpenWebLinkIn; + } + + const a = Accessible({ labelledby: "Test Accessible" }); + ok(a, "Should be able to create Accessible instances"); + + let URL = "http://example.com"; + const mockStore = createStore((state, action) => + action ? { ...state, ...action } : state, + { + initialState: { + details: { + DOMNode: {}, + accessible: { + // This accessible mock has no actorID and should be treated as + // destroyed. + isDestroyed: () => true, + value: URL, + } + }, + ui: { + supports: {} + } + }, + } + ); + const provider = createElement(Provider, { store: mockStore }, a); + const accessible = ReactDOM.render(provider, window.document.body); + ok(accessible, "Should be able to mount Accessible instances"); + + let link = document.querySelector(".url"); + testLinkClicked(link, null, URL, "tab"); + + URL = "non-URL"; + await mockStore.dispatch( + { + type: "update", + details: { + DOMNode: {}, + accessible: { + // This accessible mock has no actorID and should be treated as + // destroyed. + isDestroyed: () => true, + value: URL, + } + } + } + ); + link = document.querySelector(".url"); + ok(!link, "Non URL link should not be rendered as a link."); + } catch (e) { + ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e)); + } finally { + SimpleTest.finish(); + } +}; +</script> +</pre> +</body> +</html> diff --git a/devtools/client/accessibility/test/chrome/test_accessible_relations.html b/devtools/client/accessibility/test/chrome/test_accessible_relations.html new file mode 100644 index 0000000000..c2d868b50c --- /dev/null +++ b/devtools/client/accessibility/test/chrome/test_accessible_relations.html @@ -0,0 +1,103 @@ +<!-- 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/. --> +<!DOCTYPE HTML> +<html> +<!-- +Test that openLink function is called if accessible object property is rendered as a link. +--> +<head> + <meta charset="utf-8"> + <title>Accessible component test</title> + <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> + <link rel="stylesheet" href="chrome://devtools/skin/light-theme.css" type="text/css"> +</head> +<body> +<pre id="test"> +<script src="head.js" type="application/javascript"></script> +<script type="application/javascript"> + +"use strict"; + +window.onload = async function() { + try { + const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom"); + const { createFactory, createElement } = + browserRequire("devtools/client/shared/vendor/react"); + const { Provider } = require("devtools/client/shared/vendor/react-redux"); + const createStore = require("devtools/client/shared/redux/create-store"); + const { Simulate } = + browserRequire("devtools/client/shared/vendor/react-dom-test-utils"); + const Accessible = createFactory( + browserRequire("devtools/client/accessibility/components/Accessible")); + + const a = Accessible({ labelledby: "Test Accessible" }); + ok(a, "Should be able to create Accessible instances"); + + const mockState = { + details: { + DOMNode: {}, + accessible: { + on: () => {}, + off: () => {}, + // This accessible mock has no actorID and should be treated as + // destroyed. + isDestroyed: () => true, + }, + }, + ui: { supports: {} } + }; + + const mockStore = createStore((state, action) => + action ? { ...state, ...action } : state, { initialState: mockState }); + const provider = createElement(Provider, { store: mockStore }, a); + const accessible = ReactDOM.render(provider, window.document.body); + ok(accessible, "Should be able to mount Accessible instances"); + let relationsNode = document.getElementById("/relations"); + ok(relationsNode, "Relations are rendered when supported."); + let arrow = relationsNode.querySelector(".arrow.theme-twisty"); + is(arrow.style.visibility, "hidden", "Relations are empty."); + + info("Render accessible object with relations."); + const state = { + details: { + ...mockState.details, + relations: { + "containing document": { + actorID: "server1.conn2.child1/accessible29", + typeName: "accessible", + name: "New Tab", + role: "document", + }, + }, + }, + }; + await mockStore.dispatch({ type: "update", ...state }); + relationsNode = document.getElementById("/relations"); + ok(relationsNode, "Relations are rendered when supported."); + arrow = relationsNode.querySelector(".arrow.theme-twisty"); + ok(!arrow.style.visibility, + "There is at least one relation for the current accessible object."); + + Simulate.click(arrow, null); + const relationNode = document.getElementById("/relations/containing document"); + ok(relationNode, "Relation node is rendered."); + ok(relationNode.textContent.includes( + state.details.relations["containing document"].name), + "Relation target's name is rendered"); + ok(relationNode.textContent.includes( + state.details.relations["containing document"].role), + "Relation target's name is rendered"); + ok(relationNode.querySelector(".open-accessibility-inspector"), + "Select accessible button is rendered."); + } catch (e) { + ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e)); + } finally { + SimpleTest.finish(); + } +}; +</script> +</pre> +</body> +</html> diff --git a/devtools/client/accessibility/test/chrome/test_accessible_row_context_menu.html b/devtools/client/accessibility/test/chrome/test_accessible_row_context_menu.html new file mode 100644 index 0000000000..7cc2e6f005 --- /dev/null +++ b/devtools/client/accessibility/test/chrome/test_accessible_row_context_menu.html @@ -0,0 +1,148 @@ +<!-- 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/. --> +<!DOCTYPE HTML> +<html> +<!-- +Test that openLink function is called if accessible object property is rendered as a link. +--> +<head> + <meta charset="utf-8"> + <title>AccessibilityRow context menu test</title> + <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> + <link rel="stylesheet" href="chrome://devtools/skin/light-theme.css" type="text/css"> +</head> +<body> +<pre id="test"> +<script src="head.js" type="application/javascript"></script> +<script type="application/javascript"> + +"use strict"; + +window.onload = async function() { + try { + const { gDevTools } = require("devtools/client/framework/devtools"); + const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom"); + const { createFactory, createElement } = + browserRequire("devtools/client/shared/vendor/react"); + const { Provider } = require("devtools/client/shared/vendor/react-redux"); + const createStore = require("devtools/client/shared/redux/create-store"); + const { Simulate } = + browserRequire("devtools/client/shared/vendor/react-dom-test-utils"); + const AccessibilityRow = createFactory( + browserRequire("devtools/client/accessibility/components/AccessibilityRow")); + const { FILTERS } = browserRequire("devtools/client/accessibility/constants"); + + async function withMockEnv(func) { + const { gTelemetry: originalTelemetry } = window; + window.gTelemetry = null; + + await func(); + + window.gTelemetry = originalTelemetry; + } + + function renderAccessibilityRow(newProps, newState) { + let container = document.getElementById("container"); + if (container) { + container.remove(); + } + + const accRow = AccessibilityRow(newProps); + const mockStore = createStore((state, action) => + action ? { ...state, ...action } : state, { initialState: newState }); + const provider = createElement(Provider, { store: mockStore }, accRow); + + container = document.createElement("div"); + container.id = "container"; + document.body.appendChild(container); + return ReactDOM.render(provider, container); + } + + const ROW_ID = "test-row"; + const JSON_URL_PREFIX = "data:application/json;charset=UTF-8,"; + const SNAPSHOT = { "snapshot": true }; + const defaultProps = { + id: ROW_ID, + member: { + object: { + name: "test", + value: "test", + loading: false, + selected: false, + hasChildren: false, + snapshot: async () => SNAPSHOT, + on: () => {}, + off: () => {}, + // This accessible mock has no actorID and should be treated as + // destroyed. + isDestroyed: () => true, + }, + }, + columns: [ + { "id": "default", "title": "role" }, + { "id": "value", "title": "name" }, + ], + provider: { + getValue: (object, id) => object[id], + }, + hasContextMenu: true, + toolboxDoc: document, + }; + + const auditState = { audit: { filters: { [FILTERS.CONTRAST]: false }}}; + + const defaultState = { + ui: { supports: {} }, + ...auditState, + }; + + info("Check contextmenu default behaviour."); + renderAccessibilityRow(defaultProps, defaultState); + const row = document.getElementById(ROW_ID); + + info("Get topmost document where the context meny will be rendered"); + const menuDoc = document.defaultView.windowRoot.ownerGlobal.document; + await withMockEnv(async function() { + Simulate.contextMenu(row); + + const menu = menuDoc.getElementById("accessibility-row-contextmenu"); + const printtojsonMenuItem = menuDoc.getElementById("menu-printtojson"); + + ok(menu, "Accessibility row context menu is open"); + ok(printtojsonMenuItem, "Print to JSON menu item is visible"); + + const browserWindow = Services.wm.getMostRecentWindow(gDevTools.chromeWindowType); + const defaultOpenWebLinkIn = browserWindow.openWebLinkIn; + + let openWebLinkInCalled; + const openWebLinkInPromise = new Promise(resolve => { + openWebLinkInCalled = resolve; + }); + + // Mock top chrome window's @openWebLinkIn method. + browserWindow.openWebLinkIn = (...args) => { + openWebLinkInCalled(args); + }; + printtojsonMenuItem.click(); + + const [ url, where ] = await openWebLinkInPromise; + is(url, `${JSON_URL_PREFIX}${encodeURIComponent(JSON.stringify(SNAPSHOT))}`, + "Correct URL is opened"); + is(where, "tab", "URL was opened correctly"); + + // Reset @openWebLinkIn to default. + browserWindow.openWebLinkIn = defaultOpenWebLinkIn; + menu.remove(); + }); + } catch (e) { + ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e)); + } finally { + SimpleTest.finish(); + } +}; +</script> +</pre> +</body> +</html> |