mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-12-18 02:40:34 +00:00
Small clean up and TOC update
Change-Id: Ic093888cb2b06d8eef95a1317d791e7e1627d0f6
This commit is contained in:
parent
4755086474
commit
733990f881
|
@ -60,12 +60,6 @@ abstract class SkinVector extends SkinMustache {
|
||||||
/** @var int */
|
/** @var int */
|
||||||
private const MENU_TYPE_DROPDOWN = 2;
|
private const MENU_TYPE_DROPDOWN = 2;
|
||||||
private const MENU_TYPE_PORTAL = 3;
|
private const MENU_TYPE_PORTAL = 3;
|
||||||
private const NO_ICON = [
|
|
||||||
'icon' => 'none',
|
|
||||||
'is-quiet' => true,
|
|
||||||
'tabindex' => '-1',
|
|
||||||
'class' => 'sticky-header-icon'
|
|
||||||
];
|
|
||||||
private const TALK_ICON = [
|
private const TALK_ICON = [
|
||||||
'href' => '#',
|
'href' => '#',
|
||||||
'id' => 'ca-talk-sticky-header',
|
'id' => 'ca-talk-sticky-header',
|
||||||
|
@ -495,7 +489,6 @@ abstract class SkinVector extends SkinMustache {
|
||||||
*/
|
*/
|
||||||
public function getTemplateData(): array {
|
public function getTemplateData(): array {
|
||||||
$skin = $this;
|
$skin = $this;
|
||||||
$out = $skin->getOutput();
|
|
||||||
$parentData = $this->decoratePortletsData( parent::getTemplateData() );
|
$parentData = $this->decoratePortletsData( parent::getTemplateData() );
|
||||||
$featureManager = VectorServices::getFeatureManager();
|
$featureManager = VectorServices::getFeatureManager();
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<li id="toc-{{anchor}}"
|
<li id="toc-{{number}}"
|
||||||
class="sidebar-toc-list-item sidebar-toc-level-{{toclevel}}{{#is-top-level-section}}{{^vector-is-collapse-sections-enabled}} sidebar-toc-list-item-expanded{{/vector-is-collapse-sections-enabled}}{{/is-top-level-section}}">
|
class="sidebar-toc-list-item sidebar-toc-level-{{toclevel}}{{#is-top-level-section}}{{^vector-is-collapse-sections-enabled}} sidebar-toc-list-item-expanded{{/vector-is-collapse-sections-enabled}}{{/is-top-level-section}}">
|
||||||
<a class="sidebar-toc-link" href="#{{anchor}}">
|
<a class="sidebar-toc-link" href="#{{anchor}}">
|
||||||
<div class="sidebar-toc-text">
|
<div class="sidebar-toc-text">
|
||||||
|
|
|
@ -11,7 +11,7 @@ exports[`Table of contents when \`vector-is-collapse-sections-enabled\` is false
|
||||||
<div class=\\"sidebar-toc-text\\">Beginning</div>
|
<div class=\\"sidebar-toc-text\\">Beginning</div>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li id=\\"toc-foo\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1 sidebar-toc-list-item-expanded\\">
|
<li id=\\"toc-1\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1 sidebar-toc-list-item-expanded\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#foo\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#foo\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">1</span>foo</div>
|
<span class=\\"sidebar-toc-numb\\">1</span>foo</div>
|
||||||
|
@ -19,20 +19,20 @@ exports[`Table of contents when \`vector-is-collapse-sections-enabled\` is false
|
||||||
<ul class=\\"sidebar-toc-list\\">
|
<ul class=\\"sidebar-toc-list\\">
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li id=\\"toc-bar\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1 sidebar-toc-list-item-expanded\\">
|
<li id=\\"toc-2\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1 sidebar-toc-list-item-expanded\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#bar\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#bar\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">2</span>bar</div>
|
<span class=\\"sidebar-toc-numb\\">2</span>bar</div>
|
||||||
</a>
|
</a>
|
||||||
<button class=\\"mw-ui-icon mw-ui-icon-wikimedia-downTriangle mw-ui-icon-small sidebar-toc-toggle\\"></button>
|
<button class=\\"mw-ui-icon mw-ui-icon-wikimedia-downTriangle mw-ui-icon-small sidebar-toc-toggle\\"></button>
|
||||||
<ul class=\\"sidebar-toc-list\\">
|
<ul class=\\"sidebar-toc-list\\">
|
||||||
<li id=\\"toc-baz\\" class=\\"sidebar-toc-list-item sidebar-toc-level-2\\">
|
<li id=\\"toc-2.1\\" class=\\"sidebar-toc-list-item sidebar-toc-level-2\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#baz\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#baz\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">2.1</span>baz</div>
|
<span class=\\"sidebar-toc-numb\\">2.1</span>baz</div>
|
||||||
</a>
|
</a>
|
||||||
<ul class=\\"sidebar-toc-list\\">
|
<ul class=\\"sidebar-toc-list\\">
|
||||||
<li id=\\"toc-qux\\" class=\\"sidebar-toc-list-item sidebar-toc-level-3\\">
|
<li id=\\"toc-2.1.1\\" class=\\"sidebar-toc-list-item sidebar-toc-level-3\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#qux\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#qux\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">2.1.1</span>qux</div>
|
<span class=\\"sidebar-toc-numb\\">2.1.1</span>qux</div>
|
||||||
|
@ -44,7 +44,7 @@ exports[`Table of contents when \`vector-is-collapse-sections-enabled\` is false
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li id=\\"toc-quux\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1 sidebar-toc-list-item-expanded\\">
|
<li id=\\"toc-3\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1 sidebar-toc-list-item-expanded\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#quux\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#quux\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">3</span>quux</div>
|
<span class=\\"sidebar-toc-numb\\">3</span>quux</div>
|
||||||
|
@ -68,7 +68,7 @@ exports[`Table of contents when \`vector-is-collapse-sections-enabled\` is true
|
||||||
<div class=\\"sidebar-toc-text\\">Beginning</div>
|
<div class=\\"sidebar-toc-text\\">Beginning</div>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li id=\\"toc-foo\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1\\">
|
<li id=\\"toc-1\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#foo\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#foo\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">1</span>foo</div>
|
<span class=\\"sidebar-toc-numb\\">1</span>foo</div>
|
||||||
|
@ -76,20 +76,20 @@ exports[`Table of contents when \`vector-is-collapse-sections-enabled\` is true
|
||||||
<ul class=\\"sidebar-toc-list\\">
|
<ul class=\\"sidebar-toc-list\\">
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li id=\\"toc-bar\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1\\">
|
<li id=\\"toc-2\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#bar\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#bar\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">2</span>bar</div>
|
<span class=\\"sidebar-toc-numb\\">2</span>bar</div>
|
||||||
</a>
|
</a>
|
||||||
<button class=\\"mw-ui-icon mw-ui-icon-wikimedia-downTriangle mw-ui-icon-small sidebar-toc-toggle\\"></button>
|
<button class=\\"mw-ui-icon mw-ui-icon-wikimedia-downTriangle mw-ui-icon-small sidebar-toc-toggle\\"></button>
|
||||||
<ul class=\\"sidebar-toc-list\\">
|
<ul class=\\"sidebar-toc-list\\">
|
||||||
<li id=\\"toc-baz\\" class=\\"sidebar-toc-list-item sidebar-toc-level-2\\">
|
<li id=\\"toc-2.1\\" class=\\"sidebar-toc-list-item sidebar-toc-level-2\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#baz\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#baz\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">2.1</span>baz</div>
|
<span class=\\"sidebar-toc-numb\\">2.1</span>baz</div>
|
||||||
</a>
|
</a>
|
||||||
<ul class=\\"sidebar-toc-list\\">
|
<ul class=\\"sidebar-toc-list\\">
|
||||||
<li id=\\"toc-qux\\" class=\\"sidebar-toc-list-item sidebar-toc-level-3\\">
|
<li id=\\"toc-2.1.1\\" class=\\"sidebar-toc-list-item sidebar-toc-level-3\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#qux\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#qux\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">2.1.1</span>qux</div>
|
<span class=\\"sidebar-toc-numb\\">2.1.1</span>qux</div>
|
||||||
|
@ -101,7 +101,7 @@ exports[`Table of contents when \`vector-is-collapse-sections-enabled\` is true
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li id=\\"toc-quux\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1\\">
|
<li id=\\"toc-3\\" class=\\"sidebar-toc-list-item sidebar-toc-level-1\\">
|
||||||
<a class=\\"sidebar-toc-link\\" href=\\"#quux\\">
|
<a class=\\"sidebar-toc-link\\" href=\\"#quux\\">
|
||||||
<div class=\\"sidebar-toc-text\\">
|
<div class=\\"sidebar-toc-text\\">
|
||||||
<span class=\\"sidebar-toc-numb\\">3</span>quux</div>
|
<span class=\\"sidebar-toc-numb\\">3</span>quux</div>
|
||||||
|
|
|
@ -82,11 +82,11 @@ function mount( templateProps = {} ) {
|
||||||
onToggleClick
|
onToggleClick
|
||||||
} );
|
} );
|
||||||
|
|
||||||
fooSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-foo' ) );
|
fooSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-1' ) );
|
||||||
barSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-bar' ) );
|
barSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-2' ) );
|
||||||
bazSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-baz' ) );
|
bazSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-2.1' ) );
|
||||||
quxSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-qux' ) );
|
quxSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-2.1.1' ) );
|
||||||
quuxSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-quux' ) );
|
quuxSection = /** @type {HTMLElement} */ ( document.getElementById( 'toc-3' ) );
|
||||||
return toc;
|
return toc;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -94,7 +94,7 @@ describe( 'Table of contents', () => {
|
||||||
describe( 'binds event listeners', () => {
|
describe( 'binds event listeners', () => {
|
||||||
test( 'for onHeadingClick', () => {
|
test( 'for onHeadingClick', () => {
|
||||||
const toc = mount();
|
const toc = mount();
|
||||||
const heading = /** @type {HTMLElement} */ ( document.querySelector( `#toc-foo .${toc.LINK_CLASS}` ) );
|
const heading = /** @type {HTMLElement} */ ( document.querySelector( `#toc-1 .${toc.LINK_CLASS}` ) );
|
||||||
heading.click();
|
heading.click();
|
||||||
|
|
||||||
expect( onToggleClick ).not.toBeCalled();
|
expect( onToggleClick ).not.toBeCalled();
|
||||||
|
@ -102,7 +102,7 @@ describe( 'Table of contents', () => {
|
||||||
} );
|
} );
|
||||||
test( 'for onToggleClick', () => {
|
test( 'for onToggleClick', () => {
|
||||||
const toc = mount();
|
const toc = mount();
|
||||||
const toggle = /** @type {HTMLElement} */ ( document.querySelector( `#toc-bar .${toc.TOGGLE_CLASS}` ) );
|
const toggle = /** @type {HTMLElement} */ ( document.querySelector( `#toc-2 .${toc.TOGGLE_CLASS}` ) );
|
||||||
toggle.click();
|
toggle.click();
|
||||||
|
|
||||||
expect( onHeadingClick ).not.toBeCalled();
|
expect( onHeadingClick ).not.toBeCalled();
|
||||||
|
@ -122,28 +122,28 @@ describe( 'Table of contents', () => {
|
||||||
describe( 'when changing sections', () => {
|
describe( 'when changing sections', () => {
|
||||||
test( 'applies correct class', () => {
|
test( 'applies correct class', () => {
|
||||||
const toc = mount( { 'vector-is-collapse-sections-enabled': true } );
|
const toc = mount( { 'vector-is-collapse-sections-enabled': true } );
|
||||||
toc.changeActiveSection( 'toc-foo' );
|
toc.changeActiveSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( quxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quuxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( quuxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
|
||||||
toc.changeActiveSection( 'toc-bar' );
|
toc.changeActiveSection( 'toc-2' );
|
||||||
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( quxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quuxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( quuxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
|
||||||
toc.changeActiveSection( 'toc-baz' );
|
toc.changeActiveSection( 'toc-2.1' );
|
||||||
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( quxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( quxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quuxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( quuxSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
|
||||||
toc.changeActiveSection( 'toc-qux' );
|
toc.changeActiveSection( 'toc-2.1.1' );
|
||||||
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( fooSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
expect( barSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.ACTIVE_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
@ -160,14 +160,14 @@ describe( 'Table of contents', () => {
|
||||||
|
|
||||||
test( 'expands sections', () => {
|
test( 'expands sections', () => {
|
||||||
const toc = mount();
|
const toc = mount();
|
||||||
toc.expandSection( 'toc-foo' );
|
toc.expandSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( quxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quuxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( quuxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
|
|
||||||
toc.expandSection( 'toc-bar' );
|
toc.expandSection( 'toc-2' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
@ -177,10 +177,10 @@ describe( 'Table of contents', () => {
|
||||||
|
|
||||||
test( 'toggles expanded sections', () => {
|
test( 'toggles expanded sections', () => {
|
||||||
const toc = mount();
|
const toc = mount();
|
||||||
toc.toggleExpandSection( 'toc-foo' );
|
toc.toggleExpandSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
|
||||||
toc.toggleExpandSection( 'toc-foo' );
|
toc.toggleExpandSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
} );
|
} );
|
||||||
} );
|
} );
|
||||||
|
@ -193,14 +193,14 @@ describe( 'Table of contents', () => {
|
||||||
|
|
||||||
test( 'expands sections', () => {
|
test( 'expands sections', () => {
|
||||||
const toc = mount( { 'vector-is-collapse-sections-enabled': true } );
|
const toc = mount( { 'vector-is-collapse-sections-enabled': true } );
|
||||||
toc.expandSection( 'toc-foo' );
|
toc.expandSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( quxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
expect( quuxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( quuxSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
|
||||||
toc.expandSection( 'toc-bar' );
|
toc.expandSection( 'toc-2' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( barSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( bazSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
|
@ -210,10 +210,10 @@ describe( 'Table of contents', () => {
|
||||||
|
|
||||||
test( 'toggles expanded sections', () => {
|
test( 'toggles expanded sections', () => {
|
||||||
const toc = mount( { 'vector-is-collapse-sections-enabled': true } );
|
const toc = mount( { 'vector-is-collapse-sections-enabled': true } );
|
||||||
toc.toggleExpandSection( 'toc-foo' );
|
toc.toggleExpandSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( true );
|
||||||
|
|
||||||
toc.toggleExpandSection( 'toc-foo' );
|
toc.toggleExpandSection( 'toc-1' );
|
||||||
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
expect( fooSection.classList.contains( toc.EXPANDED_SECTION_CLASS ) ).toEqual( false );
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue