wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-12-27 07:02:52 +00:00
Code Issues Packages Projects Releases Wiki Activity
mediawiki-skins-Vector/tests/jest/__snapshots__/tableOfContents.test.js.snap
weebney 6dcb40447d Fix missing span tag on ToC items 
There is a missing span tag in the table of contents where text is placed directly into a div, breaking convention.

Change-Id: I12280e2c6a6e688b36a906d5b5a5c5deba42c977
2024-05-24 11:29:06 -07:00

308 lines
13 KiB
Plaintext
Raw Blame History

// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Table of contents reloadTableOfContents re-renders toc when wikipage.tableOfContents hook is fired with empty sections 1`] = `
"<div id=\\"vector-toc\\" class=\\"vector-toc vector-pinnable-element\\">
<div class=\\"vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned\\" data-feature-name=\\"pinned\\" data-pinnable-element-id=\\"vector-toc\\">
<h2 class=\\"vector-pinnable-header-label\\">Contents</h2>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-pin-button\\" data-event-name=\\"pinnable-header.vector-toc.pin\\">move to sidebar</button>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button\\" data-event-name=\\"pinnable-header.vector-toc.unpin\\">hide</button>
</div>
<ul class=\\"vector-toc-contents\\" id=\\"mw-panel-toc-list\\">
<li id=\\"toc-mw-content-text\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a href=\\"#\\" class=\\"vector-toc-link\\">
<div class=\\"vector-toc-text\\">Beginning</div>
</a>
</li>
<li id=\\"toc-foo\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#foo\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">1</span>
<span>foo</span>
</div>
</a>
<ul id=\\"toc-foo-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
<li id=\\"toc-bar\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#bar\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2</span>
<span>bar</span>
</div>
</a>
<button aria-controls=\\"toc-bar-sublist\\" class=\\"cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle\\" aria-expanded=\\"true\\">
<span class=\\"vector-icon mw-ui-icon-wikimedia-expand\\"></span>
<span>Toggle bar subsection</span>
</button>
<ul id=\\"toc-bar-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-baz\\" class=\\"vector-toc-list-item vector-toc-level-2\\">
<a class=\\"vector-toc-link\\" href=\\"#baz\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1</span>
<span>baz</span>
</div>
</a>
<ul id=\\"toc-baz-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-qux\\" class=\\"vector-toc-list-item vector-toc-level-3\\">
<a class=\\"vector-toc-link\\" href=\\"#qux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1.1</span>
<span>qux</span>
</div>
</a>
<ul id=\\"toc-qux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li id=\\"toc-quux\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#quux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">3</span>
<span>quux</span>
</div>
</a>
<ul id=\\"toc-quux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</div>
"
`;
exports[`Table of contents reloadTableOfContents re-renders toc when wikipage.tableOfContents hook is fired with sections 1`] = `
"<div id=\\"vector-toc\\" class=\\"vector-toc vector-pinnable-element\\">
<div class=\\"vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned\\" data-feature-name=\\"pinned\\" data-pinnable-element-id=\\"vector-toc\\">
<h2 class=\\"vector-pinnable-header-label\\">Contents</h2>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-pin-button\\" data-event-name=\\"pinnable-header.vector-toc.pin\\">move to sidebar</button>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button\\" data-event-name=\\"pinnable-header.vector-toc.unpin\\">hide</button>
</div>
<ul class=\\"vector-toc-contents\\" id=\\"mw-panel-toc-list\\"><div id=\\"vector-toc\\" class=\\"vector-toc vector-pinnable-element\\">
<div class=\\"vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned\\" data-feature-name=\\"pinned\\" data-pinnable-element-id=\\"vector-toc\\">
<h2 class=\\"vector-pinnable-header-label\\">Contents</h2>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-pin-button\\" data-event-name=\\"pinnable-header.vector-toc.pin\\">move to sidebar</button>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button\\" data-event-name=\\"pinnable-header.vector-toc.unpin\\">hide</button>
</div>
<ul class=\\"vector-toc-contents\\" id=\\"mw-panel-toc-list\\">
<li id=\\"toc-mw-content-text\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a href=\\"#\\" class=\\"vector-toc-link\\">
<div class=\\"vector-toc-text\\">Beginning</div>
</a>
</li>
<li id=\\"toc-foo\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#foo\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">1</span>
<span>foo</span>
</div>
</a>
<ul id=\\"toc-foo-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
<li id=\\"toc-bar\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#bar\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2</span>
<span>bar</span>
</div>
</a>
<button aria-controls=\\"toc-bar-sublist\\" class=\\"cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle\\" aria-expanded=\\"true\\">
<span class=\\"vector-icon mw-ui-icon-wikimedia-expand\\"></span>
<span>Toggle bar subsection</span>
</button>
<ul id=\\"toc-bar-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-baz\\" class=\\"vector-toc-list-item vector-toc-level-2\\">
<a class=\\"vector-toc-link\\" href=\\"#baz\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1</span>
<span>baz</span>
</div>
</a>
<ul id=\\"toc-baz-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-qux\\" class=\\"vector-toc-list-item vector-toc-level-3\\">
<a class=\\"vector-toc-link\\" href=\\"#qux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1.1</span>
<span>qux</span>
</div>
</a>
<ul id=\\"toc-qux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li id=\\"toc-quux\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#quux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">3</span>
<span>quux</span>
</div>
</a>
<ul id=\\"toc-quux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
<li id=\\"toc-bat\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#bat\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">4</span>
<span>bat</span>
</div>
</a>
<ul id=\\"toc-bat-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</div>
</ul>
</div>
"
`;
exports[`Table of contents renders when \`vector-is-collapse-sections-enabled\` is false 1`] = `
"<div id=\\"vector-toc\\" class=\\"vector-toc vector-pinnable-element\\">
<div class=\\"vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned\\" data-feature-name=\\"pinned\\" data-pinnable-element-id=\\"vector-toc\\">
<h2 class=\\"vector-pinnable-header-label\\">Contents</h2>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-pin-button\\" data-event-name=\\"pinnable-header.vector-toc.pin\\">move to sidebar</button>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button\\" data-event-name=\\"pinnable-header.vector-toc.unpin\\">hide</button>
</div>
<ul class=\\"vector-toc-contents\\" id=\\"mw-panel-toc-list\\">
<li id=\\"toc-mw-content-text\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a href=\\"#\\" class=\\"vector-toc-link\\">
<div class=\\"vector-toc-text\\">Beginning</div>
</a>
</li>
<li id=\\"toc-foo\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#foo\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">1</span>
<span>foo</span>
</div>
</a>
<ul id=\\"toc-foo-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
<li id=\\"toc-bar\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#bar\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2</span>
<span>bar</span>
</div>
</a>
<button aria-controls=\\"toc-bar-sublist\\" class=\\"cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle\\" aria-expanded=\\"true\\">
<span class=\\"vector-icon mw-ui-icon-wikimedia-expand\\"></span>
<span>Toggle bar subsection</span>
</button>
<ul id=\\"toc-bar-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-baz\\" class=\\"vector-toc-list-item vector-toc-level-2\\">
<a class=\\"vector-toc-link\\" href=\\"#baz\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1</span>
<span>baz</span>
</div>
</a>
<ul id=\\"toc-baz-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-qux\\" class=\\"vector-toc-list-item vector-toc-level-3\\">
<a class=\\"vector-toc-link\\" href=\\"#qux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1.1</span>
<span>qux</span>
</div>
</a>
<ul id=\\"toc-qux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li id=\\"toc-quux\\" class=\\"vector-toc-list-item vector-toc-level-1 vector-toc-list-item-expanded\\">
<a class=\\"vector-toc-link\\" href=\\"#quux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">3</span>
<span>quux</span>
</div>
</a>
<ul id=\\"toc-quux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</div>
"
`;
exports[`Table of contents renders when \`vector-is-collapse-sections-enabled\` is true 1`] = `
"<div id=\\"vector-toc\\" class=\\"vector-toc vector-pinnable-element\\">
<div class=\\"vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned\\" data-feature-name=\\"pinned\\" data-pinnable-element-id=\\"vector-toc\\">
<h2 class=\\"vector-pinnable-header-label\\">Contents</h2>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-pin-button\\" data-event-name=\\"pinnable-header.vector-toc.pin\\">move to sidebar</button>
<button class=\\"vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button\\" data-event-name=\\"pinnable-header.vector-toc.unpin\\">hide</button>
</div>
<ul class=\\"vector-toc-contents\\" id=\\"mw-panel-toc-list\\">
<li id=\\"toc-mw-content-text\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a href=\\"#\\" class=\\"vector-toc-link\\">
<div class=\\"vector-toc-text\\">Beginning</div>
</a>
</li>
<li id=\\"toc-foo\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a class=\\"vector-toc-link\\" href=\\"#foo\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">1</span>
<span>foo</span>
</div>
</a>
<ul id=\\"toc-foo-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
<li id=\\"toc-bar\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a class=\\"vector-toc-link\\" href=\\"#bar\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2</span>
<span>bar</span>
</div>
</a>
<button aria-controls=\\"toc-bar-sublist\\" class=\\"cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle\\" aria-expanded=\\"false\\">
<span class=\\"vector-icon mw-ui-icon-wikimedia-expand\\"></span>
<span>Toggle bar subsection</span>
</button>
<ul id=\\"toc-bar-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-baz\\" class=\\"vector-toc-list-item vector-toc-level-2\\">
<a class=\\"vector-toc-link\\" href=\\"#baz\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1</span>
<span>baz</span>
</div>
</a>
<ul id=\\"toc-baz-sublist\\" class=\\"vector-toc-list\\">
<li id=\\"toc-qux\\" class=\\"vector-toc-list-item vector-toc-level-3\\">
<a class=\\"vector-toc-link\\" href=\\"#qux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">2.1.1</span>
<span>qux</span>
</div>
</a>
<ul id=\\"toc-qux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li id=\\"toc-quux\\" class=\\"vector-toc-list-item vector-toc-level-1\\">
<a class=\\"vector-toc-link\\" href=\\"#quux\\">
<div class=\\"vector-toc-text\\">
<span class=\\"vector-toc-numb\\">3</span>
<span>quux</span>
</div>
</a>
<ul id=\\"toc-quux-sublist\\" class=\\"vector-toc-list\\">
</ul>
</li>
</ul>
</div>
"
`;
Reference in a new issue View git blame Copy permalink