skin: Convert table of contents from <table> to <div>

It makes no sense semantically; it was only used to make the TOC not
span full width of the page, which is easily achieved with CSS.

Bug: 658
Change-Id: I4ecd0659d1f955a9b593d281a3fef0a81c218a52

diff --git a/RELEASE-NOTES-1.22 b/RELEASE-NOTES-1.22
index fb8896a..6393252 100644 (file)
--- a/RELEASE-NOTES-1.22
+++ b/RELEASE-NOTES-1.22
@@ -162,6 +162,11 @@ production.
 * (bug 41281) Fixed ugly output if file size could not be extracted for multi-page media.
 * (bug 50315) list=logevents API module will now output log entries by anonymous users.
 * (bug 38911) Handle headers with rowspan in jquery.tablesorter
+* (bug 658) Converted the table of contents on wiki pages from <table> to <div>
+  and adjusted skin CSS accordingly. The CSS was carefully crafted to be
+  backwards-compatible in all reasonable cases (uses of the __TOC__ magic word,
+  the #toc CSS id and the .toc CSS class). However, particularly bad abuse of
+  the id or the class can possibly break.
 
 === API changes in 1.22 ===
 * (bug 25553) The JSON output formatter now leaves forward slashes unescaped

diff --git a/includes/Linker.php b/includes/Linker.php
index 3529d28..5bb9230 100644 (file)
--- a/includes/Linker.php
+++ b/includes/Linker.php
@@ -1688,10 +1688,10 @@ class Linker {
                $lang = wfGetLangObj( $lang );
                $title = wfMessage( 'toc' )->inLanguage( $lang )->escaped();
 
-               return '<table id="toc" class="toc"><tr><td>'
+               return '<div id="toc" class="toc">'
                        . '<div id="toctitle"><h2>' . $title . "</h2></div>\n"
                        . $toc
-                       . "</ul>\n</td></tr></table>\n";
+                       . "</ul>\n</div>\n";
        }
 
        /**

diff --git a/skins/common/commonContent.css b/skins/common/commonContent.css
index a36fa48..ee102f7 100644 (file)
--- a/skins/common/commonContent.css
+++ b/skins/common/commonContent.css
@@ -14,6 +14,36 @@
        padding: 5px;
        font-size: 95%;
 }
+
+/**
+ * We want to display the ToC element with intrinsic width. There are a few good
+ * old ways of making it this way, including floating it or making it a table.
+ * Both are clearly suboptimal.
+ *
+ * Thus we use display: inline-block. It is treated as an inline element with
+ * regard to text flow, but this isn't an issue here as the ToC is always
+ * sandwiched between other block-level elements.
+ */
+#toc,
+.toc {
+       display: -moz-inline-block;
+       display: inline-block;
+       zoom: 1;
+       *display: inline;
+       padding: 7px;
+}
+
+/* CSS for backwards-compatibility with cached page renders and creative uses in wikitext */
+table#toc,
+table.toc {
+       border-collapse: collapse;
+}
+/* Remove additional paddings inside table-cells that are not present in <div>s */
+table#toc td,
+table.toc td {
+       padding: 0;
+}
+
 #toc h2,
 .toc h2 {
        display: inline;

diff --git a/skins/common/oldshared.css b/skins/common/oldshared.css
index 2a9c25f..7f90c77 100644 (file)
--- a/skins/common/oldshared.css
+++ b/skins/common/oldshared.css
@@ -121,6 +121,21 @@ img { border: none; }
        padding: 5px;
        font-size: 95%;
        text-align: center;
+       display: -moz-inline-block;
+       display: inline-block;
+       zoom: 1;
+       *display: inline;
+       padding: 7px;
+}
+/* CSS for backwards-compatibility with cached page renders and creative uses in wikitext */
+table#toc,
+table.toc {
+       border-collapse: collapse;
+}
+/* Remove additional paddings inside table-cells that are not present in <div>s */
+table#toc td,
+table.toc td {
+       padding: 0;
 }
 #toc h2,
 .toc h2 {

diff --git a/skins/modern/main.css b/skins/modern/main.css
index f222028..47a2542 100644 (file)
--- a/skins/modern/main.css
+++ b/skins/modern/main.css
@@ -546,6 +546,23 @@ img.thumbborder {
        border-spacing: 0;
        background-color: #f0f0f0;
        border: solid 1px #bbbbbb;
+       display: -moz-inline-block;
+       display: inline-block;
+       zoom: 1;
+       *display: inline;
+       padding: 7px;
+}
+
+/* CSS for backwards-compatibility with cached page renders and creative uses in wikitext */
+table#toc,
+table.toc {
+       border-collapse: collapse;
+}
+
+/* Remove additional paddings inside table-cells that are not present in <div>s */
+table#toc td,
+table.toc td {
+       padding: 0;
 }
 
 #toc tr, #toc td {

diff --git a/tests/parser/parserTests.txt b/tests/parser/parserTests.txt
index 17f9437..34ec408 100644 (file)
--- a/tests/parser/parserTests.txt
+++ b/tests/parser/parserTests.txt
@@ -8631,7 +8631,7 @@ Section headings with TOC
 Some text
 ===Another headline===
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Headline_1"><span class="tocnumber">1</span> <span class="toctext">Headline 1</span></a>
 <ul>
@@ -8652,7 +8652,7 @@ Some text
 </ul>
 </li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Headline_1">Headline 1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: Headline 1">edit</a>]</span></h2>
 <h3><span class="mw-headline" id="Subheadline_1">Subheadline 1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: Subheadline 1">edit</a>]</span></h3>
 <h5><span class="mw-headline" id="Skipping_a_level">Skipping a level</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: Skipping a level">edit</a>]</span></h5>
@@ -8679,7 +8679,7 @@ Handling of sections up to level 6 and beyond
 ========= Level 9 Heading=========
 ========== Level 10 Heading==========
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Level_1_Heading"><span class="tocnumber">1</span> <span class="toctext">Level 1 Heading</span></a>
 <ul>
@@ -8707,7 +8707,7 @@ Handling of sections up to level 6 and beyond
 </ul>
 </li>
 </ul>
-</td></tr></table>
+</div>
 <h1><span class="mw-headline" id="Level_1_Heading">Level 1 Heading</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: Level 1 Heading">edit</a>]</span></h1>
 <h2><span class="mw-headline" id="Level_2_Heading">Level 2 Heading</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: Level 2 Heading">edit</a>]</span></h2>
 <h3><span class="mw-headline" id="Level_3_Heading">Level 3 Heading</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: Level 3 Heading">edit</a>]</span></h3>
@@ -8731,7 +8731,7 @@ TOC regression (bug 9764)
 == title 2 ==
 === title 2.1 ===
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#title_1"><span class="tocnumber">1</span> <span class="toctext">title 1</span></a>
 <ul>
@@ -8749,7 +8749,7 @@ TOC regression (bug 9764)
 </ul>
 </li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="title_1">title 1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: title 1">edit</a>]</span></h2>
 <h3><span class="mw-headline" id="title_1.1">title 1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: title 1.1">edit</a>]</span></h3>
 <h4><span class="mw-headline" id="title_1.1.1">title 1.1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: title 1.1.1">edit</a>]</span></h4>
@@ -8771,7 +8771,7 @@ wgMaxTocLevel=3
 == title 2 ==
 === title 2.1 ===
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#title_1"><span class="tocnumber">1</span> <span class="toctext">title 1</span></a>
 <ul>
@@ -8785,7 +8785,7 @@ wgMaxTocLevel=3
 </ul>
 </li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="title_1">title 1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: title 1">edit</a>]</span></h2>
 <h3><span class="mw-headline" id="title_1.1">title 1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: title 1.1">edit</a>]</span></h3>
 <h4><span class="mw-headline" id="title_1.1.1">title 1.1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: title 1.1.1">edit</a>]</span></h4>
@@ -8806,7 +8806,7 @@ wgMaxTocLevel=3
 ====Section 1.1.1.1====
 ==Section 2==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Section_1"><span class="tocnumber">1</span> <span class="toctext">Section 1</span></a>
 <ul>
@@ -8815,7 +8815,7 @@ wgMaxTocLevel=3
 </li>
 <li class="toclevel-1 tocsection-5"><a href="#Section_2"><span class="tocnumber">2</span> <span class="toctext">Section 2</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Section_1">Section 1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: Section 1">edit</a>]</span></h2>
 <h3><span class="mw-headline" id="Section_1.1">Section 1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: Section 1.1">edit</a>]</span></h3>
 <h4><span class="mw-headline" id="Section_1.1.1">Section 1.1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: Section 1.1.1">edit</a>]</span></h4>
@@ -8898,7 +8898,7 @@ __TOC__
 === title 1.1 ===
 == title 2 ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#title_1"><span class="tocnumber">1</span> <span class="toctext">title 1</span></a>
 <ul>
@@ -8907,7 +8907,7 @@ __TOC__
 </li>
 <li class="toclevel-1 tocsection-3"><a href="#title_2"><span class="tocnumber">2</span> <span class="toctext">title 2</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="title_1">title 1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: title 1">edit</a>]</span></h2>
 <h3><span class="mw-headline" id="title_1.1">title 1.1</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: title 1.1">edit</a>]</span></h3>
 <h2><span class="mw-headline" id="title_2">title 2</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: title 2">edit</a>]</span></h2>
@@ -8962,7 +8962,7 @@ section 5
 !! result
 <p>The tooltips shall not show entities to the user (ie. be double escaped)
 </p>
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#text_.3E_text"><span class="tocnumber">1</span> <span class="toctext">text &gt; text</span></a></li>
 <li class="toclevel-1 tocsection-2"><a href="#text_.3C_text"><span class="tocnumber">2</span> <span class="toctext">text &lt; text</span></a></li>
@@ -8970,7 +8970,7 @@ section 5
 <li class="toclevel-1 tocsection-4"><a href="#text_.27_text"><span class="tocnumber">4</span> <span class="toctext">text ' text</span></a></li>
 <li class="toclevel-1 tocsection-5"><a href="#text_.22_text"><span class="tocnumber">5</span> <span class="toctext">text " text</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="text_.3E_text">text &gt; text</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: text > text">edit</a>]</span></h2>
 <p>section 1
 </p>
@@ -8997,14 +8997,14 @@ Headers with excess '=' characters
 =''italic'' heading==
 ==''italic'' heading=
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#foo.3D"><span class="tocnumber">1</span> <span class="toctext">foo=</span></a></li>
 <li class="toclevel-1 tocsection-2"><a href="#.3Dfoo"><span class="tocnumber">2</span> <span class="toctext">=foo</span></a></li>
 <li class="toclevel-1 tocsection-3"><a href="#italic_heading.3D"><span class="tocnumber">3</span> <span class="toctext"><i>italic</i> heading=</span></a></li>
 <li class="toclevel-1 tocsection-4"><a href="#.3Ditalic_heading"><span class="tocnumber">4</span> <span class="toctext">=<i>italic</i> heading</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h1><span class="mw-headline" id="foo.3D">foo=</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: foo=">edit</a>]</span></h1>
 <h1><span class="mw-headline" id=".3Dfoo">=foo</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: =foo">edit</a>]</span></h1>
 <h1><span class="mw-headline" id="italic_heading.3D"><i>italic</i> heading=</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: italic heading=">edit</a>]</span></h1>
@@ -9026,7 +9026,7 @@ HTML headers vs TOC (bug 23393)
 == Header 2.2 ==
 __NOEDITSECTION__
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1"><a href="#Header_1"><span class="tocnumber">1</span> <span class="toctext">Header 1</span></a>
 <ul>
@@ -9041,7 +9041,7 @@ __NOEDITSECTION__
 </ul>
 </li>
 </ul>
-</td></tr></table>
+</div>
 <h1><span class="mw-headline" id="Header_1">Header 1</span></h1>
 <h2><span class="mw-headline" id="Header_1.1">Header 1.1</span></h2>
 <h2><span class="mw-headline" id="Header_1.2">Header 1.2</span></h2>
@@ -10335,11 +10335,11 @@ Fuzz testing: Parser14
 http://__TOC__
 !! result
 <h2><span class="mw-headline" id="onmouseover.3D">onmouseover=</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: onmouseover=">edit</a>]</span></h2>
-http://<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+http://<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#onmouseover.3D"><span class="tocnumber">1</span> <span class="toctext">onmouseover=</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 
 !! end
 
@@ -12161,7 +12161,7 @@ Out-of-order TOC heading levels
 =====5=====
 ==2==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#2"><span class="tocnumber">1</span> <span class="toctext">2</span></a>
 <ul>
@@ -12176,7 +12176,7 @@ Out-of-order TOC heading levels
 </ul>
 </li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="2">2</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: 2">edit</a>]</span></h2>
 <h6><span class="mw-headline" id="6">6</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: 6">edit</a>]</span></h6>
 <h3><span class="mw-headline" id="3">3</span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: 3">edit</a>]</span></h3>
@@ -13754,11 +13754,11 @@ title=[[Main Page]]
 __TOC__
 == ''Lost'' episodes ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Lost_episodes"><span class="tocnumber">1</span> <span class="toctext"><i>Lost</i> episodes</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Lost_episodes"><i>Lost</i> episodes</span><span class="mw-editsection">[<a href="/index.php?title=Main_Page&amp;action=edit&amp;section=1" title="Edit section: Lost episodes">edit</a>]</span></h2>
 
 !! end
@@ -13771,11 +13771,11 @@ title=[[Main Page]]
 __TOC__
 == '''should be bold''' then normal text ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#should_be_bold_then_normal_text"><span class="tocnumber">1</span> <span class="toctext"><b>should be bold</b> then normal text</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="should_be_bold_then_normal_text"><b>should be bold</b> then normal text</span><span class="mw-editsection">[<a href="/index.php?title=Main_Page&amp;action=edit&amp;section=1" title="Edit section: should be bold then normal text">edit</a>]</span></h2>
 
 !! end
@@ -13788,11 +13788,11 @@ title=[[Main Page]]
 __TOC__
 == Image [[Image:foobar.jpg]] ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Image"><span class="tocnumber">1</span> <span class="toctext">Image</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Image">Image <a href="/wiki/File:Foobar.jpg" class="image"><img alt="Foobar.jpg" src="http://example.com/images/3/3a/Foobar.jpg" width="1941" height="220" /></a></span><span class="mw-editsection">[<a href="/index.php?title=Main_Page&amp;action=edit&amp;section=1" title="Edit section: Image">edit</a>]</span></h2>
 
 !! end
@@ -13805,11 +13805,11 @@ title=[[Main Page]]
 __TOC__
 == <blockquote>Quote</blockquote> ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Quote"><span class="tocnumber">1</span> <span class="toctext">Quote</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Quote"><blockquote>Quote</blockquote></span><span class="mw-editsection">[<a href="/index.php?title=Main_Page&amp;action=edit&amp;section=1" title="Edit section: Quote">edit</a>]</span></h2>
 
 !! end
@@ -13824,11 +13824,11 @@ __TOC__
 <small>Hanc marginis exiguitas non caperet.</small>
 QED
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Proof:_2_.3C_3"><span class="tocnumber">1</span> <span class="toctext">Proof: 2 &lt; 3</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Proof:_2_.3C_3">Proof: 2 &lt; 3</span><span class="mw-editsection">[<a href="/index.php?title=Main_Page&amp;action=edit&amp;section=1" title="Edit section: Proof: 2 &lt; 3">edit</a>]</span></h2>
 <p><small>Hanc marginis exiguitas non caperet.</small>
 QED
@@ -13843,12 +13843,12 @@ __TOC__
 
 == <i>Foo</i> <blockquote>Bar</blockquote> ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Foo_Bar"><span class="tocnumber">1</span> <span class="toctext"><i>Foo</i> <b>Bar</b></span></a></li>
 <li class="toclevel-1 tocsection-2"><a href="#Foo_Bar_2"><span class="tocnumber">2</span> <span class="toctext"><i>Foo</i> Bar</span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Foo_Bar"><i>Foo</i> <b>Bar</b></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: Foo Bar">edit</a>]</span></h2>
 <h2><span class="mw-headline" id="Foo_Bar_2"><i>Foo</i> <blockquote>Bar</blockquote></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: Foo Bar">edit</a>]</span></h2>
 
@@ -13862,12 +13862,12 @@ __TOC__
 
 == <sup class="a > b">Evilbye</sup> ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#Hello"><span class="tocnumber">1</span> <span class="toctext"><sup>Hello</sup></span></a></li>
 <li class="toclevel-1 tocsection-2"><a href="#b.22.3EEvilbye"><span class="tocnumber">2</span> <span class="toctext"><sup> b"&gt;Evilbye</sup></span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="Hello"><sup class="in-h2">Hello</sup></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: Hello">edit</a>]</span></h2>
 <h2><span class="mw-headline" id="b.22.3EEvilbye"><sup> b"&gt;Evilbye</sup></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: b&quot;>Evilbye">edit</a>]</span></h2>
 
@@ -13887,7 +13887,7 @@ __TOC__
 
 == <span dir="ltr" style="font-style: italic">Attributes after dir on these span tags must be deleted from the TOC</span> ==
 !! result
-<table id="toc" class="toc"><tr><td><div id="toctitle"><h2>Contents</h2></div>
+<div id="toc" class="toc"><div id="toctitle"><h2>Contents</h2></div>
 <ul>
 <li class="toclevel-1 tocsection-1"><a href="#C.2B.2B"><span class="tocnumber">1</span> <span class="toctext"><span dir="ltr">C++</span></span></a></li>
 <li class="toclevel-1 tocsection-2"><a href="#.D7.96.D7.91.D7.A0.D7.92.21"><span class="tocnumber">2</span> <span class="toctext"><span dir="rtl">זבנג!</span></span></a></li>
@@ -13895,7 +13895,7 @@ __TOC__
 <li class="toclevel-1 tocsection-4"><a href="#All_attributes_on_these_span_tags_must_be_deleted_from_the_TOC"><span class="tocnumber">4</span> <span class="toctext"><span>All attributes on these span tags must be deleted from the TOC</span></span></a></li>
 <li class="toclevel-1 tocsection-5"><a href="#Attributes_after_dir_on_these_span_tags_must_be_deleted_from_the_TOC"><span class="tocnumber">5</span> <span class="toctext"><span dir="ltr">Attributes after dir on these span tags must be deleted from the TOC</span></span></a></li>
 </ul>
-</td></tr></table>
+</div>
 <h2><span class="mw-headline" id="C.2B.2B"><span dir="ltr">C++</span></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=1" title="Edit section: C++">edit</a>]</span></h2>
 <h2><span class="mw-headline" id=".D7.96.D7.91.D7.A0.D7.92.21"><span dir="rtl">זבנג!</span></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=2" title="Edit section: זבנג!">edit</a>]</span></h2>
 <h2><span class="mw-headline" id="The_attributes_on_these_span_tags_must_be_deleted_from_the_TOC"><span style="font-style: italic">The attributes on these span tags must be deleted from the TOC</span></span><span class="mw-editsection">[<a href="/index.php?title=Parser_test&amp;action=edit&amp;section=3" title="Edit section: The attributes on these span tags must be deleted from the TOC">edit</a>]</span></h2>

diff --git a/tests/qunit/suites/resources/mediawiki/mediawiki.util.test.js b/tests/qunit/suites/resources/mediawiki/mediawiki.util.test.js
index 713ec4b..b4b5d0b 100644 (file)
--- a/tests/qunit/suites/resources/mediawiki/mediawiki.util.test.js
+++ b/tests/qunit/suites/resources/mediawiki/mediawiki.util.test.js
@@ -84,13 +84,13 @@
 
                assert.strictEqual( mw.util.toggleToc(), null, 'Return null if there is no table of contents on the page.' );
 
-               tocHtml = '<table id="toc" class="toc"><tr><td>' +
+               tocHtml = '<div id="toc" class="toc">' +
                        '<div id="toctitle">' +
                        '<h2>Contents</h2>' +
                        '<span class="toctoggle">&nbsp;[<a href="#" class="internal" id="togglelink">Hide</a>&nbsp;]</span>' +
                        '</div>' +
                        '<ul><li></li></ul>' +
-                       '</td></tr></table>';
+                       '</div>';
                $( tocHtml ).appendTo( '#qunit-fixture' ),
                        $toggleLink = $( '#togglelink' );