Skip to content

Handle missing quotes and leading slashes #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
simonewebdesign wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Handle missing quotes and leading slashes #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
071f8d8
rm bundled.html
simonewebdesign May 2, 2021
8a3ed35
Stylesheet regex without quotes and remove leading slashes
simonewebdesign May 3, 2021
d47c25d
Handle missing double quotes also in scriptTags and inlineImages
simonewebdesign May 3, 2021
b420631
Remove leading slashes in scriptTags and inlineImages
simonewebdesign May 3, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 0 additions & 11 deletions bundled.html
View file
Open in desktop

This file was deleted.

4 changes: 2 additions & 2 deletions src/inlineImages.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,13 @@ const fs = require('fs').promises;
const path = require('path');

let inlineImages = async htmlPath => {
const imgTagRegex = /<img (.* )?src="([\w.\-\/]+)"(.*)>/;
const imgTagRegex = /<img (.* )?src="?([\w.\-\/]+)"?(.*)>/;
Copy link
Copy Markdown
Owner

@mahhov mahhov May 19, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we're going to relax this, then we may as well include single quotes as well.
Specifically, here and in the other files, replace "? with ['"]?

Copy link
Copy Markdown
Contributor Author

@simonewebdesign simonewebdesign Oct 5, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @mahhov, sorry I didn't get back to you on this. I think my change actually breaks in some cases (can't recall the exact problem now) - it happened to work fine on my minified stylesheet, but didn't really test other cases. Merging this PR at the current state is probably not a good idea, unless I dig into the problem and add some more tests!

let html = await fs.readFile(htmlPath, 'utf8');
let matches = html.match(new RegExp(imgTagRegex, 'g'));
if (!matches)
return html;
let imgPromises = matches
.map(imgTag => imgTag.match(imgTagRegex)[2])
.map(imgTag => imgTag.match(imgTagRegex)[2].replace(/^\/+/, ''))
.map(relImgPath => path.resolve(path.dirname(htmlPath), relImgPath))
.map(imgPath => fs.readFile(imgPath));
let i = 0;
Expand Down
4 changes: 2 additions & 2 deletions src/inlineScriptTags.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,13 @@ const fs = require('fs').promises;
const path = require('path');

let inlineHtmlScripts = async htmlPath => {
const scriptTagRegex = /<script (?:.* )?src="([\w.\-\/]+)".*><\/script>/;
const scriptTagRegex = /<script (?:.* )?src="?([\w.\-\/]+)"?.*><\/script>/;
let html = await fs.readFile(htmlPath, 'utf8');
let matches = html.match(new RegExp(scriptTagRegex, 'g'));
if (!matches)
return html;
let scriptPromises = matches
.map(scriptTag => scriptTag.match(scriptTagRegex)[1])
.map(scriptTag => scriptTag.match(scriptTagRegex)[1].replace(/^\/+/, ''))
.map(relScriptPath => path.resolve(path.dirname(htmlPath), relScriptPath))
.map(scriptPath => fs.readFile(scriptPath, 'utf8'));
let i = 0;
Expand Down
4 changes: 2 additions & 2 deletions src/inlineStylesheets.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,15 +4,15 @@ const fs = require('fs').promises;
const path = require('path');

let inlineHtmlStyles = async htmlPath => {
const linkTagRegex = /<link (?:.* )?rel="stylesheet"(?:.* )?href="([\w.\-\/]+)".*>|<link (?:.* )?href="([\w.\-\/]+)"(?:.* )?rel="stylesheet".*>/;
const linkTagRegex = /<link (?:.* )?rel="?stylesheet"?(?:.* )?href="?([\w.\-\/]+)"?.*>|<link (?:.* )?href="?([\w.\-\/]+)"?(?:.* )?rel="?stylesheet"?.*>/;
let html = await fs.readFile(htmlPath, 'utf8');
let matches = html.match(new RegExp(linkTagRegex, 'g'));
if (!matches)
return html;
let stylesheetPromises = matches
.map(linkTag => {
let m = linkTag.match(linkTagRegex);
return m[1] || m[2];
return (m[1] || m[2]).replace(/^\/+/, '');
})
.map(relPath => path.resolve(path.dirname(htmlPath), relPath))
.map(stylesheetPath => fs.readFile(stylesheetPath, 'utf8'));
Expand Down
4 changes: 4 additions & 0 deletions test/testInlineImages/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
<img src="red_dot.png" alt="red dot" />

<img alt="" src="icons/rss-icon.svg"width="18">

<img src=icons/rss-icon.svg>

<img src=//red_dot.png>
4 changes: 4 additions & 0 deletions test/testInlineScriptTags/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,7 @@
<script src="nested/myNestedScript.js" type="application/javascript"></script>

<p>line 3</p>

<script src=myScript.js></script>

<script src="///myScript.js"></script>
9 changes: 7 additions & 2 deletions test/testInlineStylesheets/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,17 @@
Incorrect syntax
<linkrel="stylesheet" href="myStyle.css">


Link tags with `rel="stylesheet"` should be replaced.

<link href="myStyle.css" rel="stylesheet">

Should also work with `rel=stylesheet` (no double quotes)
<link href=myStyle.css rel=stylesheet>

Space between attributes is optional
<link rel="stylesheet"href="myStyle.css">

Nesting
<link href="nested/myNestedStylesheet.css" rel="stylesheet" />

Leading slashes are removed
<link href="/nested/myNestedStylesheet.css" rel="stylesheet">