-
Notifications
You must be signed in to change notification settings - Fork 754
/
file-reloading.js
105 lines (105 loc) · 4.65 KB
/
file-reloading.js
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
describe('Reloading files', function() {
context('CSS', function() {
beforeEach(function() {
cy.visit(Cypress.env('BS_URL'));
});
it('should reload single <link>', function() {
cy.exec('touch test/fixtures/**/style.css');
cy.get('[id="css-style"]').should($link => {
const url = new URL($link.attr('href'));
expect(url.search).to.contain('?browsersync=');
});
});
it('should reload 2 css files', function() {
cy.exec('touch test/fixtures/**/*.css');
cy.get('link').should($links => {
$links.each((i, elem) => {
const url = new URL(elem.href);
return expect(url.search).to.contain('?browsersync=');
});
});
});
it('should reload with *.css', function() {
cy.get('#__bs_notify__').should('have.length', 1);
cy.request('POST', 'http://localhost:3000/__browser_sync__',
JSON.stringify([
"file:reload",
{"ext":"css","path":"*.css","basename":"*/*.css","event":"change","type":"inject","log":true}
])
);
cy.get('link').should($links => {
$links.each((i, elem) => {
const url = new URL(elem.href);
return expect(url.search).to.contain('?browsersync=');
});
});
});
});
context('CSS IMPORTS', function() {
it('can import 1 stylesheet from <style>@import</style>', () => {
cy.visit(Cypress.env('BS_URL') + '/import.html');
cy.document().then((doc) => {
const firstStyle = doc.getElementsByTagName('style')[0];
const href = firstStyle.sheet.cssRules[0].href;
expect(href).to.not.contain('?browsersync=');
});
cy.exec('touch test/fixtures/assets/import.css');
cy.get('style').eq(0).should((style) => {
const href = style[0].sheet.cssRules[0].href;
expect(href).to.contain('?browsersync=');
});
});
it('can import nested from nested @import rules', () => {
cy.visit(Cypress.env('BS_URL') + '/import-link.html');
cy.document().then((doc) => {
const href = doc.styleSheets[0].cssRules[0].href;
expect(href).to.not.contain('?browsersync=');
});
cy.exec('touch test/fixtures/assets/import2.css');
cy.get('link').eq(0).should((link) => {
const href = link[0].sheet.cssRules[0].href;
expect(href).to.contain('?browsersync=');
})
});
});
context('IMG', function() {
beforeEach(function() {
cy.visit(Cypress.env('BS_URL') + '/images.html');
});
it('should reload single <img src>', function() {
cy.exec('touch test/fixtures/**/cam-secure.png');
cy.get('[id="img-src-attr"]').should($link => {
const url = new URL($link.attr('src'));
expect(url.search).to.contain('?browsersync=');
});
cy.get('[id="img-style"]').should($link => {
const urlFromStyle = $link.css('backgroundImage').split('"').slice(1, -1);
const url = new URL(urlFromStyle);
expect(url.search).not.to.contain('?browsersync=');
});
});
it('should reload single style backgroundImage style property', function() {
cy.exec('touch test/fixtures/**/cam-secure-02.png');
cy.get('[id="img-src-attr"]').should($link => {
expect($link.attr('src')).not.to.contain('?browsersync=');
});
cy.get('[id="img-style"]').should($link => {
const urlFromStyle = $link.css('backgroundImage').split('"').slice(1, -1);
const url = new URL(urlFromStyle);
expect(url.search).to.contain('?browsersync=');
});
});
it('should reload both images', function() {
cy.exec('touch test/fixtures/**/*.png');
cy.get('[id="img-src-attr"]').should($link => {
const url = new URL($link.attr('src'));
expect(url.search).to.contain('?browsersync=');
});
cy.get('[id="img-style"]').should($link => {
const urlFromStyle = $link.css('backgroundImage').split('"').slice(1, -1);
const url = new URL(urlFromStyle);
expect(url.search).to.contain('?browsersync=');
});
});
});
});