"use strict";
// Copyright 2021 The Chromium Authors
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
Object.defineProperty(exports, "__esModule", { value: true });
const chai_1 = require("chai");
const elements_helpers_js_1 = require("../helpers/elements-helpers.js");
const settings_helpers_js_1 = require("../helpers/settings-helpers.js");
describe('The Elements tab', function () {
    it('is able to update shadow dom tree structure upon typing', async ({ devToolsPage, inspectedPage }) => {
        await inspectedPage.goToResource('elements/shadow-dom-modify-chardata.html');
        await (0, settings_helpers_js_1.togglePreferenceInSettingsTab)('User agent shadow DOM', undefined, devToolsPage);
        await (0, elements_helpers_js_1.expandSelectedNodeRecursively)(devToolsPage);
        const tree = await devToolsPage.waitForAria('Page DOM');
        chai_1.assert.include(await tree.evaluate(e => e.textContent), '<div>​</div>​');
        const input = await inspectedPage.waitForSelector('#input1');
        await input?.type('Bar');
        await devToolsPage.waitForElementWithTextContent('Bar', tree);
        chai_1.assert.include(await tree.evaluate(e => e.textContent), '<div>​Bar​</div>​');
    });
    it('shows the documentURL for <iframe> documents', async ({ devToolsPage, inspectedPage }) => {
        await inspectedPage.goToResource('elements/iframe-documenturl.html');
        // Check to make sure we have the correct node selected after opening a file
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)('<body>\u200B', devToolsPage);
        // Navigate to the <iframe> child node.
        await devToolsPage.pressKey('ArrowRight');
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)('<iframe src=\u200B"shadow-dom-modify-chardata.html">\u200B…\u200B</iframe>\u200B', devToolsPage);
        // Open the iframe (shows new nodes, but does not alter the selected node)
        await devToolsPage.pressKey('ArrowRight');
        await (0, elements_helpers_js_1.waitForChildrenOfSelectedElementNode)(devToolsPage);
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)('<iframe src=\u200B"shadow-dom-modify-chardata.html">\u200B', devToolsPage);
        // Check that the #document tree node properly reflects the document URL.
        await devToolsPage.pressKey('ArrowRight');
        await (0, elements_helpers_js_1.waitForPartialContentOfSelectedElementsNode)('#document', devToolsPage);
        chai_1.assert.match(await (0, elements_helpers_js_1.getContentOfSelectedNode)(devToolsPage), /#document \(https?:\/\/.*\/test\/e2e\/resources\/elements\/shadow-dom-modify-chardata.html\)/);
    });
    it('automatically selects previously selected user agent and open shadow roots after reload', async ({ devToolsPage, inspectedPage }) => {
        await inspectedPage.goToHtml(`
        <span id="hostElement"></span>
        <script>
          var root = document.getElementById("hostElement").attachShadow({mode: 'open'});
          root.innerHTML = "<input type='text'>";
        </script>
        `);
        await (0, settings_helpers_js_1.togglePreferenceInSettingsTab)('User agent shadow DOM', undefined, devToolsPage);
        await (0, elements_helpers_js_1.expandSelectedNodeRecursively)(devToolsPage);
        const userAgentRootSelector = '#shadow-root (user-agent)';
        await devToolsPage.click(`pierceShadowText/${userAgentRootSelector}`);
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)(userAgentRootSelector, devToolsPage);
        await inspectedPage.reload();
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)(userAgentRootSelector, devToolsPage);
        const openRootSelector = '#shadow-root (open)';
        await devToolsPage.click(`pierceShadowText/${openRootSelector}`);
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)(openRootSelector, devToolsPage);
        await (0, elements_helpers_js_1.clickNthChildOfSelectedElementNode)(1, devToolsPage);
        await (0, elements_helpers_js_1.waitForSelectedNodeChange)('openRootSelector', devToolsPage);
        await inspectedPage.reload();
        await (0, elements_helpers_js_1.waitForContentOfSelectedElementsNode)('<input type=​"text">​', devToolsPage);
    });
    it('nodes can be copied in ElementsTreeOutline', async ({ devToolsPage, inspectedPage }) => {
        await inspectedPage.goToHtml(`<span id="node-to-copy">This should be <b>copied</b>.</span><div id="paste-here"></div>`);
        await (0, elements_helpers_js_1.waitForElementsStyleSection)(undefined, devToolsPage);
        const nodeToCopyElement = await (0, elements_helpers_js_1.waitForElementWithPartialText)('node-to-copy', devToolsPage);
        await nodeToCopyElement.click();
        await devToolsPage.pressKey('c', { control: true });
        const nodeToPasteIn = await (0, elements_helpers_js_1.waitForElementWithPartialText)('paste-here', devToolsPage);
        await nodeToPasteIn.click();
        await devToolsPage.pressKey('v', { control: true });
        await nodeToPasteIn.$('span#node-to-copy');
    });
});
//# sourceMappingURL=elements-tree.test.js.map