1// Copyright 2020 The Chromium Authors. All rights reserved.
2// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5import {assert} from 'chai';
6
7import {enableExperiment, goToResource, step} from '../../shared/helper.js';
8import {describe, it} from '../../shared/mocha-extensions.js';
9import {expandSelectedNodeRecursively, getGridsInLayoutPane, openLayoutPane, toggleElementCheckboxInLayoutPane, waitForAdorners, waitForContentOfSelectedElementsNode, waitForElementsStyleSection, waitForSomeGridsInLayoutPane} from '../helpers/elements-helpers.js';
10import {togglePreferenceInSettingsTab} from '../helpers/settings-helpers.js';
11
12describe('Layout Pane in the Elements Tab', async function() {
13  beforeEach(async () => {
14    await enableExperiment('cssGridFeatures');
15  });
16
17  it('displays Layout pane', async () => {
18    await goToResource('elements/css-grid.html');
19    await step('Prepare elements tab', async () => {
20      await waitForElementsStyleSection();
21      await waitForContentOfSelectedElementsNode('<body>\u200B');
22      await expandSelectedNodeRecursively();
23    });
24    await waitForAdorners([
25      {textContent: 'grid', isActive: false},
26    ]);
27    await openLayoutPane();
28    await toggleElementCheckboxInLayoutPane();
29    await waitForAdorners([
30      {textContent: 'grid', isActive: true},
31    ]);
32  });
33
34  it('Lists grids in UA shadow DOM only when needed', async () => {
35    await goToResource('elements/css-grid-ua-shadow.html');
36    await openLayoutPane();
37
38    const grids = await getGridsInLayoutPane();
39    assert.strictEqual(grids.length, 1, 'Without UA shadow DOM, there is only one grid');
40
41    await togglePreferenceInSettingsTab('Show user agent shadow DOM');
42
43    // We only wait for at least 2 grids, the <video> element may generate more grids, but we're not interested
44    // in testing how many exactly.
45    await waitForSomeGridsInLayoutPane(2);
46  });
47});
48