81 lines
3 KiB
JavaScript
81 lines
3 KiB
JavaScript
/* Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/ */
|
|
/* eslint no-unused-vars: [2, {"vars": "local"}] */
|
|
|
|
"use strict";
|
|
|
|
// Import the inspector's head.js first (which itself imports shared-head.js).
|
|
Services.scriptloader.loadSubScript(
|
|
"chrome://mochitests/content/browser/devtools/client/inspector/test/head.js",
|
|
this
|
|
);
|
|
|
|
const FLEXBOX_OPENED_PREF = "devtools.layout.flexbox.opened";
|
|
const FLEX_CONTAINER_OPENED_PREF = "devtools.layout.flex-container.opened";
|
|
const FLEX_ITEM_OPENED_PREF = "devtools.layout.flex-item.opened";
|
|
const GRID_OPENED_PREF = "devtools.layout.grid.opened";
|
|
const BOXMODEL_OPENED_PREF = "devtools.layout.boxmodel.opened";
|
|
|
|
// Make sure only the flexbox layout accordions are opened, and the others are closed.
|
|
Services.prefs.setBoolPref(FLEXBOX_OPENED_PREF, true);
|
|
Services.prefs.setBoolPref(FLEX_CONTAINER_OPENED_PREF, true);
|
|
Services.prefs.setBoolPref(FLEX_ITEM_OPENED_PREF, true);
|
|
Services.prefs.setBoolPref(BOXMODEL_OPENED_PREF, false);
|
|
Services.prefs.setBoolPref(GRID_OPENED_PREF, false);
|
|
|
|
// Clear all set prefs.
|
|
registerCleanupFunction(() => {
|
|
Services.prefs.clearUserPref(FLEXBOX_OPENED_PREF);
|
|
Services.prefs.clearUserPref(FLEX_CONTAINER_OPENED_PREF);
|
|
Services.prefs.clearUserPref(FLEX_ITEM_OPENED_PREF);
|
|
Services.prefs.clearUserPref(BOXMODEL_OPENED_PREF);
|
|
Services.prefs.clearUserPref(GRID_OPENED_PREF);
|
|
});
|
|
|
|
/**
|
|
* Toggles ON the flexbox highlighter given the flexbox highlighter button from the
|
|
* layout panel.
|
|
*
|
|
* @param {DOMNode} button
|
|
* The flexbox highlighter toggle button in the flex container panel.
|
|
* @param {Inspector} inspector
|
|
* Inspector panel instance.
|
|
*/
|
|
async function toggleHighlighterON(button, inspector) {
|
|
info("Toggling ON the flexbox highlighter from the layout panel.");
|
|
const { waitForHighlighterTypeShown } = getHighlighterTestHelpers(inspector);
|
|
const onHighlighterShown = waitForHighlighterTypeShown(
|
|
inspector.highlighters.TYPES.FLEXBOX
|
|
);
|
|
const { store } = inspector;
|
|
const onToggleChange = waitUntilState(
|
|
store,
|
|
state => state.flexbox.highlighted
|
|
);
|
|
button.click();
|
|
await Promise.all([onHighlighterShown, onToggleChange]);
|
|
}
|
|
|
|
/**
|
|
* Toggles OFF the flexbox highlighter given the flexbox highlighter button from the
|
|
* layout panel.
|
|
*
|
|
* @param {DOMNode} button
|
|
* The flexbox highlighter toggle button in the flex container panel.
|
|
* @param {Inspector} inspector
|
|
* Inspector panel instance.
|
|
*/
|
|
async function toggleHighlighterOFF(button, inspector) {
|
|
info("Toggling OFF the flexbox highlighter from the layout panel.");
|
|
const { waitForHighlighterTypeHidden } = getHighlighterTestHelpers(inspector);
|
|
const onHighlighterHidden = waitForHighlighterTypeHidden(
|
|
inspector.highlighters.TYPES.FLEXBOX
|
|
);
|
|
const { store } = inspector;
|
|
const onToggleChange = waitUntilState(
|
|
store,
|
|
state => !state.flexbox.highlighted
|
|
);
|
|
button.click();
|
|
await Promise.all([onHighlighterHidden, onToggleChange]);
|
|
}
|