Detect 'trailing' content when comparing DOMs

test/test-pages/hidden-nodes/expected.html

@@ -1,4 +1,5 @@
 <div id="readability-page-1" class="page">
     <p> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p>
     <h2> Secondary header </h2>
+    <h2> Third header </h2>
 </div>

test/test-pages/hukumusume/expected.html

@@ -40,7 +40,7 @@
         <p> 　肉をくわえたイヌが、橋を渡っていました。 　ふと下を見ると、川の中にも肉をくわえたイヌがいます。　イヌはそれを見て、思いました。（あいつの肉の方が、大きそうだ） 　イヌは、くやしくてたまりません。 （そうだ、あいつをおどかして、あの肉を取ってやろう） 　そこでイヌは、川の中のイヌに向かって思いっきり吠えました。 「ウゥー、ワン！！」 　そのとたん、くわえていた肉はポチャンと川の中に落ちてしまいました。 「ああー、ぁぁー」 　川の中には、がっかりしたイヌの顔がうつっています。 　さっきの川の中のイヌは、水にうつった自分の顔だったのです。 　同じ物を持っていても、人が持っている物の方が良く見え、また、欲張るとけっきょく損をするというお話しです。 </p>
         <p> おしまい </p>
         <div>
-            <p></p>
+            <p><span><img src="http://fakehost/gazou/pc_gazou/all/top_bana/back_logo_r.gif" alt="前のページへ戻る" name="Image10" width="175" height="32" id="Image10"/></span></p>
         </div>
     </div>
 </div>

test/test-pages/lwn-1/expected.html

@@ -643,8 +643,7 @@
                 <p><b>Next page</b>: <a href="http://fakehost/Articles/637395/">Security&gt;&gt;</a>
                     <br /> </p>
             </div>
-        <!-- ArticleText -->
         </td>
-    <!-- MC -->
+        <td> </td>
     </div>
 </div>

test/test-readability.js

@@ -36,7 +36,8 @@ function inOrderIgnoreEmptyTextNodes(fromNode) {
 function traverseDOM(callback, expectedDOM, actualDOM) {
   var actualNode = actualDOM.documentElement || actualDOM.childNodes[0];
   var expectedNode = expectedDOM.documentElement || expectedDOM.childNodes[0];
-  while (actualNode) {
+  while (actualNode || expectedNode) {
+    // We'll stop if we don't have both actualNode and expectedNode
     if (!callback(actualNode, expectedNode)) {
       break;
     }
@@ -74,6 +75,9 @@ function runTestsWithItems(label, domGenerationFn, source, expectedContent, expe
 
     it("should extract expected content", function() {
       function nodeStr(n) {
+        if (!n) {
+          return "(no node)";
+        }
         if (n.nodeType == 3) {
           return "#text(" + htmlTransform(n.textContent) + ")";
         }
@@ -113,10 +117,10 @@ function runTestsWithItems(label, domGenerationFn, source, expectedContent, expe
         }).join(",");
       }
 
+
       var actualDOM = domGenerationFn(result.content);
       var expectedDOM = domGenerationFn(expectedContent);
       traverseDOM(function(actualNode, expectedNode) {
-        expect(!!actualNode).eql(!!expectedNode);
         if (actualNode && expectedNode) {
           var actualDesc = nodeStr(actualNode);
           var expectedDesc = nodeStr(expectedNode);
@@ -146,6 +150,7 @@ function runTestsWithItems(label, domGenerationFn, source, expectedContent, expe
             }
           }
         } else {
+          expect(nodeStr(actualNode), "Should have a node from both DOMs").eql(nodeStr(expectedNode));
           return false;
         }
         return true;