Skip to content

Commit 74d2c60

Browse files
fix: hash processing improved (#275)
1 parent c0d6d5b commit 74d2c60

File tree

10 files changed

+424
-109
lines changed

10 files changed

+424
-109
lines changed

src/plugins/source-plugin.js

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -627,16 +627,13 @@ export default (options) =>
627627
const { startIndex, unquoted } = source;
628628
let { value } = source;
629629
const URLObject = parse(value);
630+
const { hash } = URLObject;
630631

631-
if (URLObject.hash) {
632-
const { hash } = URLObject;
633-
632+
if (hash) {
634633
URLObject.hash = null;
635634
source.value = URLObject.format();
636635

637-
if (hash) {
638-
value = value.slice(0, value.length - hash.length);
639-
}
636+
value = value.slice(0, value.length - hash.length);
640637
}
641638

642639
const importKey = urlToRequest(decodeURIComponent(source.value), root);
@@ -656,7 +653,11 @@ export default (options) =>
656653
});
657654
}
658655

659-
const replacerKey = JSON.stringify({ importKey, unquoted });
656+
const replacerKey = JSON.stringify({
657+
importKey,
658+
unquoted,
659+
hash,
660+
});
660661
let replacerName = replacersMap.get(replacerKey);
661662

662663
if (!replacerName) {
@@ -667,20 +668,23 @@ export default (options) =>
667668
type: 'replacer',
668669
value: {
669670
type: 'source',
671+
hash,
670672
importName,
671673
replacerName,
672674
unquoted,
673675
},
674676
});
675677
}
676678

679+
const valueLength = hash ? value.length + hash.length : value.length;
680+
677681
// eslint-disable-next-line no-param-reassign
678682
html =
679683
html.substr(0, startIndex + offset) +
680684
replacerName +
681-
html.substr(startIndex + value.length + offset);
685+
html.substr(startIndex + valueLength + offset);
682686

683-
offset += replacerName.length - value.length;
687+
offset += replacerName.length - valueLength;
684688
}
685689

686690
return html;

src/runtime/getUrl.js

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,22 @@
1-
module.exports = (url, maybeNeedQuotes) => {
1+
module.exports = (url, options) => {
2+
if (!options) {
3+
// eslint-disable-next-line no-param-reassign
4+
options = {};
5+
}
6+
27
// eslint-disable-next-line no-underscore-dangle, no-param-reassign
38
url = url && url.__esModule ? url.default : url;
49

510
if (typeof url !== 'string') {
611
return url;
712
}
813

9-
if (maybeNeedQuotes && /[\t\n\f\r "'=<>`]/.test(url)) {
14+
if (options.hash) {
15+
// eslint-disable-next-line no-param-reassign
16+
url += options.hash;
17+
}
18+
19+
if (options.maybeNeedQuotes && /[\t\n\f\r "'=<>`]/.test(url)) {
1020
return `"${url}"`;
1121
}
1222

src/utils.js

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -74,11 +74,15 @@ export function getModuleCode(html, replaceableMessages) {
7474
let replacersCode = '';
7575

7676
for (const item of replaceableMessages) {
77-
const { importName, replacerName, unquoted } = item;
77+
const { importName, replacerName, unquoted, hash } = item;
7878

79-
replacersCode += `var ${replacerName} = ${GET_SOURCE_FROM_IMPORT_NAME}(${importName}${
80-
unquoted ? ', true' : ''
81-
});\n`;
79+
const getUrlOptions = []
80+
.concat(hash ? [`hash: ${JSON.stringify(hash)}`] : [])
81+
.concat(unquoted ? 'maybeNeedQuotes: true' : []);
82+
const preparedOptions =
83+
getUrlOptions.length > 0 ? `, { ${getUrlOptions.join(', ')} }` : '';
84+
85+
replacersCode += `var ${replacerName} = ${GET_SOURCE_FROM_IMPORT_NAME}(${importName}${preparedOptions});\n`;
8286

8387
code = code.replace(
8488
new RegExp(replacerName, 'g'),

test/__snapshots__/attributes-option.test.js.snap

Lines changed: 119 additions & 38 deletions
Large diffs are not rendered by default.

test/__snapshots__/esModule-option.test.js.snap

Lines changed: 39 additions & 12 deletions
Large diffs are not rendered by default.

test/__snapshots__/loader.test.js.snap

Lines changed: 13 additions & 4 deletions
Large diffs are not rendered by default.

test/__snapshots__/minimize-option.test.js.snap

Lines changed: 75 additions & 27 deletions
Large diffs are not rendered by default.

test/fixtures/simple.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -269,3 +269,5 @@ <h2>An Ordered HTML List</h2>
269269
/>
270270

271271
<img data-srcset="image.png 480w, image.png 800w" sizes="(max-width: 600px) 480px, 800px" data-src="image.png" alt="Elva dressed as a fairy">
272+
273+
<img src=~aliasImageWithSpace#hash />

test/runtime/__snapshots__/getUrl.test.js.snap

Lines changed: 61 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,4 +66,64 @@ exports[`getUrl should work 26`] = `"\\"image<image.png\\""`;
6666

6767
exports[`getUrl should work 27`] = `"\\"image\`image.png\\""`;
6868

69-
exports[`getUrl should work 28`] = `"image.png"`;
69+
exports[`getUrl should work 28`] = `"image.png#hash"`;
70+
71+
exports[`getUrl should work 29`] = `"\\"image image.png#hash\\""`;
72+
73+
exports[`getUrl should work 30`] = `
74+
"\\"image
75+
image.png#hash\\""
76+
`;
77+
78+
exports[`getUrl should work 31`] = `"\\"image image.png#hash\\""`;
79+
80+
exports[`getUrl should work 32`] = `
81+
"\\"image
82+
image.png#hash\\""
83+
`;
84+
85+
exports[`getUrl should work 33`] = `"\\"image image.png#hash\\""`;
86+
87+
exports[`getUrl should work 34`] = `"\\"image\\"image.png#hash\\""`;
88+
89+
exports[`getUrl should work 35`] = `"\\"image'image.png#hash\\""`;
90+
91+
exports[`getUrl should work 36`] = `"\\"image=image.png#hash\\""`;
92+
93+
exports[`getUrl should work 37`] = `"\\"image>image.png#hash\\""`;
94+
95+
exports[`getUrl should work 38`] = `"\\"image<image.png#hash\\""`;
96+
97+
exports[`getUrl should work 39`] = `"\\"image\`image.png#hash\\""`;
98+
99+
exports[`getUrl should work 40`] = `"image.png#hash"`;
100+
101+
exports[`getUrl should work 41`] = `"image image.png#hash"`;
102+
103+
exports[`getUrl should work 42`] = `
104+
"image
105+
image.png#hash"
106+
`;
107+
108+
exports[`getUrl should work 43`] = `"image image.png#hash"`;
109+
110+
exports[`getUrl should work 44`] = `
111+
"image
112+
image.png#hash"
113+
`;
114+
115+
exports[`getUrl should work 45`] = `"image image.png#hash"`;
116+
117+
exports[`getUrl should work 46`] = `"image\\"image.png#hash"`;
118+
119+
exports[`getUrl should work 47`] = `"image'image.png#hash"`;
120+
121+
exports[`getUrl should work 48`] = `"image=image.png#hash"`;
122+
123+
exports[`getUrl should work 49`] = `"image>image.png#hash"`;
124+
125+
exports[`getUrl should work 50`] = `"image<image.png#hash"`;
126+
127+
exports[`getUrl should work 51`] = `"image\`image.png#hash"`;
128+
129+
exports[`getUrl should work 52`] = `"image.png"`;

test/runtime/getUrl.test.js

Lines changed: 82 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -18,18 +18,88 @@ describe('getUrl', () => {
1818
expect(getUrl('image>image.png')).toMatchSnapshot();
1919
expect(getUrl('image<image.png')).toMatchSnapshot();
2020
expect(getUrl('image`image.png')).toMatchSnapshot();
21-
expect(getUrl('image.png', true)).toMatchSnapshot();
22-
expect(getUrl('image\timage.png', true)).toMatchSnapshot();
23-
expect(getUrl('image\nimage.png', true)).toMatchSnapshot();
24-
expect(getUrl('image\fimage.png', true)).toMatchSnapshot();
25-
expect(getUrl('image\rimage.png', true)).toMatchSnapshot();
26-
expect(getUrl('image image.png', true)).toMatchSnapshot();
27-
expect(getUrl('image"image.png', true)).toMatchSnapshot();
28-
expect(getUrl("image'image.png", true)).toMatchSnapshot();
29-
expect(getUrl('image=image.png', true)).toMatchSnapshot();
30-
expect(getUrl('image>image.png', true)).toMatchSnapshot();
31-
expect(getUrl('image<image.png', true)).toMatchSnapshot();
32-
expect(getUrl('image`image.png', true)).toMatchSnapshot();
21+
expect(getUrl('image.png', { maybeNeedQuotes: true })).toMatchSnapshot();
22+
expect(
23+
getUrl('image\timage.png', { maybeNeedQuotes: true })
24+
).toMatchSnapshot();
25+
expect(
26+
getUrl('image\nimage.png', { maybeNeedQuotes: true })
27+
).toMatchSnapshot();
28+
expect(
29+
getUrl('image\fimage.png', { maybeNeedQuotes: true })
30+
).toMatchSnapshot();
31+
expect(
32+
getUrl('image\rimage.png', { maybeNeedQuotes: true })
33+
).toMatchSnapshot();
34+
expect(
35+
getUrl('image image.png', { maybeNeedQuotes: true })
36+
).toMatchSnapshot();
37+
expect(
38+
getUrl('image"image.png', { maybeNeedQuotes: true })
39+
).toMatchSnapshot();
40+
expect(
41+
getUrl("image'image.png", { maybeNeedQuotes: true })
42+
).toMatchSnapshot();
43+
expect(
44+
getUrl('image=image.png', { maybeNeedQuotes: true })
45+
).toMatchSnapshot();
46+
expect(
47+
getUrl('image>image.png', { maybeNeedQuotes: true })
48+
).toMatchSnapshot();
49+
expect(
50+
getUrl('image<image.png', { maybeNeedQuotes: true })
51+
).toMatchSnapshot();
52+
expect(
53+
getUrl('image`image.png', { maybeNeedQuotes: true })
54+
).toMatchSnapshot();
55+
expect(
56+
getUrl('image.png', { maybeNeedQuotes: true, hash: '#hash' })
57+
).toMatchSnapshot();
58+
expect(
59+
getUrl('image\timage.png', { maybeNeedQuotes: true, hash: '#hash' })
60+
).toMatchSnapshot();
61+
expect(
62+
getUrl('image\nimage.png', { maybeNeedQuotes: true, hash: '#hash' })
63+
).toMatchSnapshot();
64+
expect(
65+
getUrl('image\fimage.png', { maybeNeedQuotes: true, hash: '#hash' })
66+
).toMatchSnapshot();
67+
expect(
68+
getUrl('image\rimage.png', { maybeNeedQuotes: true, hash: '#hash' })
69+
).toMatchSnapshot();
70+
expect(
71+
getUrl('image image.png', { maybeNeedQuotes: true, hash: '#hash' })
72+
).toMatchSnapshot();
73+
expect(
74+
getUrl('image"image.png', { maybeNeedQuotes: true, hash: '#hash' })
75+
).toMatchSnapshot();
76+
expect(
77+
getUrl("image'image.png", { maybeNeedQuotes: true, hash: '#hash' })
78+
).toMatchSnapshot();
79+
expect(
80+
getUrl('image=image.png', { maybeNeedQuotes: true, hash: '#hash' })
81+
).toMatchSnapshot();
82+
expect(
83+
getUrl('image>image.png', { maybeNeedQuotes: true, hash: '#hash' })
84+
).toMatchSnapshot();
85+
expect(
86+
getUrl('image<image.png', { maybeNeedQuotes: true, hash: '#hash' })
87+
).toMatchSnapshot();
88+
expect(
89+
getUrl('image`image.png', { maybeNeedQuotes: true, hash: '#hash' })
90+
).toMatchSnapshot();
91+
expect(getUrl('image.png', { hash: '#hash' })).toMatchSnapshot();
92+
expect(getUrl('image\timage.png', { hash: '#hash' })).toMatchSnapshot();
93+
expect(getUrl('image\nimage.png', { hash: '#hash' })).toMatchSnapshot();
94+
expect(getUrl('image\fimage.png', { hash: '#hash' })).toMatchSnapshot();
95+
expect(getUrl('image\rimage.png', { hash: '#hash' })).toMatchSnapshot();
96+
expect(getUrl('image image.png', { hash: '#hash' })).toMatchSnapshot();
97+
expect(getUrl('image"image.png', { hash: '#hash' })).toMatchSnapshot();
98+
expect(getUrl("image'image.png", { hash: '#hash' })).toMatchSnapshot();
99+
expect(getUrl('image=image.png', { hash: '#hash' })).toMatchSnapshot();
100+
expect(getUrl('image>image.png', { hash: '#hash' })).toMatchSnapshot();
101+
expect(getUrl('image<image.png', { hash: '#hash' })).toMatchSnapshot();
102+
expect(getUrl('image`image.png', { hash: '#hash' })).toMatchSnapshot();
33103
expect(
34104
getUrl({ default: 'image.png', __esModule: true })
35105
).toMatchSnapshot();

0 commit comments

Comments
 (0)