Skip to content

Commit

Permalink
Fixed Lists of Images Not Showing (mozilla#738)
Browse files Browse the repository at this point in the history 
Allow lists of images to appear in ReaderMode

Co-authored-by: niklasbaumgardner <63427453+niklasbaumgardner@users.noreply.github.com>

Co-authored-by: Tuxy222 <cdburnham18@gmai.com>
Co-authored-by: niklasbaumgardner <63427453+niklasbaumgardner@users.noreply.github.com>
  • Loading branch information
@Tuxy222 @niklasbaumgardner
3 people authored Nov 18, 2022
1 parent 1d2cb03 commit 7c7f694
Show file tree
Hide file tree
Showing 4 changed files with 180 additions and 0 deletions.
15 changes: 15 additions & 0 deletions Readability.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2136,6 +2136,21 @@ Readability.prototype = {
(!isList && weight < 25 && linkDensity > 0.2) ||
(weight >= 25 && linkDensity > 0.5) ||
((embedCount === 1 && contentLength < 75) || embedCount > 1);
// Allow simple lists of images to remain in pages
if (isList && haveToRemove) {
for (var x = 0; x < node.children.length; x++) {
let child = node.children[x];
// Don't filter in lists with li's that contain more than one child
if (child.children.length > 1) {
return haveToRemove;
}
}
li_count = node.getElementsByTagName("li").length;
// Only allow the list to remain if every li contains an image
if (img == li_count) {
return false;
}
}
return haveToRemove;
}
return false;
Expand Down
8 changes: 8 additions & 0 deletions test/test-pages/dev418/expected-metadata.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"title": "Readability Test",
"byline": null,
"dir": null,
"excerpt": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
"siteName": null,
"readerable": true
}
53 changes: 53 additions & 0 deletions test/test-pages/dev418/expected.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<div id="readability-page-1" class="page">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
<hr />
<h2> Single &lt;img&gt; </h2>
<p>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</p>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
<hr />
<h2> Single &lt;figure&gt; </h2>
<figure>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption> Caption of the figure </figcaption>
</figure>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
<hr />
<h2> &lt;ul&gt; List of &lt;img&gt; </h2>
<ul>
<li>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</li>
<li>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</li>
<li>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</li>
</ul>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
<hr />
<h2> &lt;ul&gt; List of &lt;figure&gt; </h2>
<ul>
<li>
<figure>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption> Caption of the figure </figcaption>
</figure>
</li>
<li>
<figure>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption> Caption of the figure </figcaption>
</figure>
</li>
<li>
<figure>
<img src="http://fakehost/test/florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption> Caption of the figure </figcaption>
</figure>
</li>
</ul>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
</div>
104 changes: 104 additions & 0 deletions test/test-pages/dev418/source.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>
Readability Test
</title>
<style>
<![CDATA[
body {
font-family: sans-serif;
margin: 0 auto;
max-width: 900px;
padding: 1em 2em;
}
img {
max-width: 100%;
}
]]>
</style>
</head>
<body>
<h1>
Readability Test
</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
<hr />
<h2>
Single &lt;img&gt;
</h2>
<p>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
<hr />
<h2>
Single &lt;figure&gt;
</h2>
<figure>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption>
Caption of the figure
</figcaption>
</figure>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
<hr />
<h2>
&lt;ul&gt; List of &lt;img&gt;
</h2>
<ul>
<li>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</li>
<li>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</li>
<li>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
</li>
</ul>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
<hr />
<h2>
&lt;ul&gt; List of &lt;figure&gt;
</h2>
<ul>
<li>
<figure>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption>
Caption of the figure
</figcaption>
</figure>
</li>
<li>
<figure>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption>
Caption of the figure
</figcaption>
</figure>
</li>
<li>
<figure>
<img src="florian-giorgio-P1U7-ZgKeOM-unsplash.jpg" alt="An image" />
<figcaption>
Caption of the figure
</figcaption>
</figure>
</li>
</ul>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</p>
</body>
</html>

0 comments on commit 7c7f694

Please sign in to comment.