Skip to content

Commit 54e0f8c

Browse files
daundaun
committed
Add tests for respecting link selector
1 parent 0a795db commit 54e0f8c

File tree

4 files changed

+90
-9
lines changed

4 files changed

+90
-9
lines changed

‎tests/fixtures/link-selector-default.html‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>Link types</title>
7+
<link rel="stylesheet" href="/assets/style.css" />
8+
</head>
9+
<body>
10+
<main id="swup" class="transition-main">
11+
<h1>Link types</h1>
12+
13+
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
14+
<ul>
15+
<li><a href="/page-1.html">Page 1</a></li>
16+
</ul>
17+
18+
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
19+
<a xlink:href="/page-2.html">
20+
<text x="10" y="10" font-size="2">SVG link</text>
21+
</a>
22+
</svg>
23+
</main>
24+
<script src="/dist/swup.umd.js"></script>
25+
<script src="/dist/index.umd.js"></script>
26+
<script>
27+
window._swup = new Swup({
28+
plugins: [new SwupPreloadPlugin()]
29+
});
30+
</script>
31+
</body>
32+
</html>

‎tests/fixtures/link-types.html‎ renamed to ‎tests/fixtures/link-selector-modified.html‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,9 @@ <h1>Link types</h1>
1717

1818
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
1919
<a xlink:href="/page-2.html">
20-
<text x="10" y="10" font-size="2">SVG link to page</text>
20+
<text x="10" y="10" font-size="2">SVG link</text>
2121
</a>
2222
</svg>
23-
24-
<img src="data:image/gif;base64,R0lGODlhAQABAAAAACw=" usemap="#imagemap" width="100" height="100" />
25-
<map name="imagemap">
26-
<area shape="rect" coords="0,0,100,100" href="/page-3.html" alt="Map link to page" />
27-
</map>
2823
</main>
2924
<script src="/dist/swup.umd.js"></script>
3025
<script src="/dist/index.umd.js"></script>

‎tests/fixtures/visible-links-selector.html‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>Preload visible links with options</title>
7+
<link rel="stylesheet" href="/assets/style.css" />
8+
</head>
9+
<body>
10+
<main id="swup" class="transition-main">
11+
<h1>Preload visible links with modified selector</h1>
12+
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
13+
<ul>
14+
<li><a href="/page-1.html">Page 1</a></li>
15+
<li><a href="/page-2.html">Page 2</a></li>
16+
<li><a href="/page-3.html">Page 3</a></li>
17+
<li><a href="/page-4.html">Page 4</a></li>
18+
<li>
19+
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
20+
<a xlink:href="/page-5.html"><text x="10" y="10" font-size="2">Page 5</text></a>
21+
</svg>
22+
</li>
23+
</ul>
24+
</main>
25+
<script src="/dist/swup.umd.js"></script>
26+
<script src="/dist/index.umd.js"></script>
27+
<script>
28+
window._swup = new Swup({
29+
linkSelector: 'li:nth-child(odd) a, svg a',
30+
plugins: [new SwupPreloadPlugin({
31+
preloadVisibleLinks: {
32+
enabled: true,
33+
delay: 10
34+
}
35+
})]
36+
});
37+
</script>
38+
</body>
39+
</html>

‎tests/functional/preload-plugin.spec.ts‎

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -94,11 +94,18 @@ test.describe('active links', () => {
9494
await expectSwupToHaveCacheEntry(page, '/page-3.html');
9595
});
9696

97-
test('preloads svg links', async ({ page }) => {
98-
await page.goto('/link-types.html');
97+
test('respects swup link selector', async ({ page }) => {
98+
await page.goto('/link-selector-default.html');
9999
await waitForSwup(page);
100+
await page.focus('svg a');
101+
await sleep(200);
100102
await expectSwupNotToHaveCacheEntry(page, '/page-2.html');
101-
await page.focus('svg a', { strict: true });
103+
});
104+
105+
test('allows modified swup link selector', async ({ page }) => {
106+
await page.goto('/link-selector-modified.html');
107+
await waitForSwup(page);
108+
await page.focus('svg a');
102109
await expectSwupToHaveCacheEntry(page, '/page-2.html');
103110
});
104111
});
@@ -155,6 +162,14 @@ test.describe('visible links', () => {
155162
await expectSwupNotToHaveCacheEntries(page, ['/page-2.html']); // ignored via ignore()
156163
await expectSwupNotToHaveCacheEntries(page, ['/page-9.html']); // ignored via containers
157164
});
165+
166+
test('respects swup link selector', async ({ page }) => {
167+
await page.goto('/visible-links-selector.html');
168+
// await scroll(page, { direction: 'down', delay: 10 });
169+
await sleep(200);
170+
await expectSwupToHaveCacheEntries(page, ['/page-1.html', '/page-3.html', '/page-5.html']);
171+
await expectSwupNotToHaveCacheEntries(page, ['/page-2.html', '/page-4.html']); // ignored via linkSelector option
172+
});
158173
});
159174

160175
test.describe('throttle', () => {

0 commit comments

Comments
 (0)