1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
|
import { expect } from 'chai';
import * as cheerio from 'cheerio';
import { loadFixture } from './test-utils.js';
describe('Scripts (hoisted and not)', () => {
let fixture;
before(async () => {
fixture = await loadFixture({
root: './fixtures/astro-scripts/',
vite: {
build: {
assetsInlineLimit: 0,
},
},
});
await fixture.build();
});
it('Moves external scripts up', async () => {
const html = await fixture.readFile('/external/index.html');
const $ = cheerio.load(html);
expect($('head script[type="module"]:not([src="/regular_script.js"])')).to.have.lengthOf(1);
expect($('body script')).to.have.lengthOf(0);
});
it('Moves inline scripts up', async () => {
const html = await fixture.readFile('/inline/index.html');
const $ = cheerio.load(html);
expect($('head script[type="module"]')).to.have.lengthOf(1);
expect($('body script')).to.have.lengthOf(0);
});
it('Inline page builds the scripts to a single bundle', async () => {
// Inline page
let inline = await fixture.readFile('/inline/index.html');
let $ = cheerio.load(inline);
let $el = $('script');
// test 1: Just one entry module
expect($el).to.have.lengthOf(1);
// test 2: attr removed
expect($el.attr('data-astro')).to.equal(undefined);
expect($el.attr('src')).to.equal(undefined);
const inlineEntryJS = $el.text();
// test 3: the JS exists
expect(inlineEntryJS).to.be.ok;
// test 4: Inline imported JS is included
expect(inlineEntryJS).to.contain(
'I AM IMPORTED INLINE',
'The inline imported JS is included in the bundle'
);
});
it("Inline scripts that are shared by multiple pages create chunks, and aren't inlined into the HTML", async () => {
let html = await fixture.readFile('/inline-shared-one/index.html');
let $ = cheerio.load(html);
expect($('script')).to.have.lengthOf(1);
expect($('script').attr('src')).to.not.equal(undefined);
});
it('External page builds the hoisted scripts to a single bundle', async () => {
let external = await fixture.readFile('/external/index.html');
let $ = cheerio.load(external);
// test 1: there are two scripts
expect($('script')).to.have.lengthOf(2);
let el = $('script').get(1);
expect($(el).attr('src')).to.equal(undefined, 'This should have been inlined');
let externalEntryJS = $(el).text();
// test 2: the JS exists
expect(externalEntryJS).to.be.ok;
});
it('External page using non-hoist scripts that are modules are built standalone', async () => {
let external = await fixture.readFile('/external-no-hoist/index.html');
let $ = cheerio.load(external);
// test 1: there is 1 scripts
expect($('script')).to.have.lengthOf(1);
// test 2: inside assets
let entryURL = $('script').attr('src');
expect(entryURL.includes('assets/')).to.equal(true);
});
it('External page using non-hoist scripts that are not modules are built standalone', async () => {
let external = await fixture.readFile('/external-no-hoist-classic/index.html');
let $ = cheerio.load(external);
// test 1: there is 1 scripts
expect($('script')).to.have.lengthOf(1);
// test 2: inside assets
let entryURL = $('script').attr('src');
expect(entryURL.includes('assets/')).to.equal(true);
});
});
|
