Stowage/warc2zim
2
0
Fork 0
mirror of https://github.com/openzim/warc2zim.git synced 2025-10-19 06:23:16 +00:00
Code Issues Projects Releases Packages Wiki Activity

Add javascript tests to test-website

Browse source
This commit is contained in:
benoit74 2024-04-04 15:52:31 +00:00
parent 9897db5202
commit 6765912308
No known key found for this signature in database
GPG key ID: B89606434FC7B530
34 changed files with 559 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

10
test-website/README.md
View file

@ -33,6 +33,16 @@ In the example above, the trick is that we have the following DNS records in pla
You can then open https://test-website.local.oviles.info:8888 in your favorite browser and run manual tests on this website (which uses the other one as sub-site for few resources on special domains with special characters).
If you wanna develop the test-website locally, you might want as well to mount the `content` folder inside the container
```
docker run -v $PWD/content:/var/www/html -p 8888:80 --rm --name test-website -e SITE_ADDRESS="test-website.local.oviles.info:80, xn--jdacents-v0aqb.local.oviles.info:80" -e STANDARD_NETLOC="http:\/\/test-website.local.oviles.info:8888" -e NOT_STANDARD_NETLOC_NOT_ENCODED="http:\/\/jédéacçents.local.oviles.info:8888" -e NOT_STANDARD_NETLOC_PUNNY_ENCODED="http:\/\/xn--jdacents-v0aqb.local.oviles.info:8888" test-website
```
This will have the adverse effect that local files will be modified as well by the `entrypoint.sh` to replace placeholders by environment variables value. And it means that you have to use "real" netloc from the environment in your modifications for test.
Once done, there is a utility script at `entrypoint-reverse.sh` which can be used to reverse these modifications once you are about to commit to Github (this will break the test-website inside Docker container, but you will be able to commit with proper modifications and then just restart the container to reapply needed modification).
## Environments variables needed in Docker image
|Environment variable | Usage | Comment | Sample value |

1
test-website/content/index.html
View file

@ -41,6 +41,7 @@
<li><a href="./chinese-encoding.html">Chinese encoding</a></li>
<li><a href="./bad-encoding.html">Bad encoding</a></li>
<li><a href="./url-encoding.html">URL encoding</a></li>
<li><a href="./javascript.html">Javascript</a></li>
</ul>
</body>

390
test-website/content/javascript.html Normal file
View file

@ -0,0 +1,390 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test website</title>
<link rel="apple-touch-icon" sizes="180x180" href="./icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./icons/favicon-16x16.png">
<link rel="manifest" href="./icons/site.webmanifest">
<link rel="shortcut icon" href="./icons/favicon.ico">
<script type="importmap">
{
"imports": {
"resources": "./javascript/resources.js",
"javascript/resources": "./javascript/resources.js",
"../javascript/resources": "./javascript/resources.js",
"https://example.com/resources": "./javascript/resources.js",
"https://standard_hostname/resources": "./javascript/resources.js",
"https://not_standard_hostname_punny_encoded/resources": "./javascript/resources.js",
"https://not_standard_hostname_not_encoded/resources": "./javascript/resources.js"
}
}
</script>
<script type="text/javascript" src="./javascript/script04.js"></script>
<link rel="preload" href="./javascript/script05.js" as="script" />
<link rel="modulepreload" href="./javascript/script07.js" />
<style>
.status {
color: red;
}
.status.green {
color: green;
}
</style>
</head>
<body>
<h2>Various Javascript</h2>
<p>On every lines below, you should see written "This is working OK"</p>
<p>
01a. Simple inline Javascript with content on "normal" FQDN: <span class="status" id="span01a">This is not working</span>
</p>
<p>
01b. Simple inline Javascript with content on "special chars" FQDN: <span class="status" id="span01b">This is not working</span>
</p>
<p>
01c. Simple inline Javascript with content on "normal" FQDN and accentuated path: <span class="status" id="span01c">This is not working</span>
</p>
<p>
01d. Simple inline Javascript with content on "special chars" FQDN and accentuated path: <span class="status" id="span01d">This is not working</span>
</p>
<p>
01e. Simple inline Javascript with content on "normal" FQDN and utf-8 char in path: <span class="status" id="span01e">This is not working</span>
</p>
<p>
01f. Simple inline Javascript with content on "special chars" FQDN and utf-8 char in path: <span class="status" id="span01f">This is not working</span>
</p>
<p>
01g. Simple inline Javascript with content on "normal" FQDN and improperly escaped accentued char in path: <span class="status" id="span01g">This is not working</span>
</p>
<p>
01h. Simple inline Javascript with content on "special chars" FQDN andimproperly escaped accentued char in path: <span class="status" id="span01h">This is not working</span>
</p>
<p>
01i. Simple inline Javascript with content on "normal" FQDN and improperly escaped utf-8 char in path: <span class="status" id="span01i">This is not working</span>
</p>
<p>
01j. Simple inline Javascript with content on "special chars" FQDN and improperly escaped utf-8 char in path: <span class="status" id="span01j">This is not working</span>
</p>
<p>
01k. Simple inline Javascript with content on improperly escaped "special chars" FQDN: <span class="status" id="span01k">This is not working</span>
</p>
<p>
01l. Simple inline Javascript with content accessed with query parameter: <span class="status" id="span01l">This is not working</span>
</p>
<p>
01m. Simple inline Javascript with content accessed with query parameter and query value containing an equal sign : <span class="status" id="span01m">This is not working</span>
</p>
<p>
01n. Simple inline Javascript with content accessed with query parameter and query value containing a percent sign: <span class="status" id="span01n">This is not working</span>
</p>
<p>
01o. Simple inline Javascript with content URL containing an interogation point sign: <span class="status" id="span01o">This is not working</span>
</p>
<p>
01p. Simple inline Javascript with content URL containing an interogation point sign and a query parameter: <span class="status" id="span01p">This is not working</span>
</p>
<p>
02. Simple classic Javascript with src: <span class="status" id="span02">This is not working</span>
</p>
<p>
03. Simple classic Javascript with src and type: <span class="status" id="span03">This is not working</span>
</p>
<p>
04. Simple classic Javascript onload: <span class="status" id="span04">This is not working</span>
</p>
<p>
05. Simple classic Javascript preload as script: <span class="status" id="span05">This is not working</span>
</p>
<p>
06a. Simple module Javascript with src and type - nominal case: <span class="status" id="span06a">This is not working</span>
</p>
<p>
06b. Simple module Javascript with src and type - unused vars: <span class="status" id="span06b">This is not working</span>
</p>
<p>
06c. Simple module Javascript with src and type - absolute path: <span class="status" id="span06c">This is not working</span>
</p>
<p>
06d. Simple module Javascript with src and type - parent path: <span class="status" id="span06d">This is not working</span>
</p>
<p>
06e. Simple module Javascript with src and type - accentuated path: <span class="status" id="span06e">This is not working</span>
</p>
<p>
06f. Simple module Javascript with src and type - querystring: <span class="status" id="span06f">This is not working</span>
</p>
<p>
06g. Simple module Javascript with src and type - querystring with equal sign in value: <span class="status" id="span06g">This is not working</span>
</p>
<p>
06h. Simple module Javascript with src and type - querystring with percent sign in value: <span class="status" id="span06h">This is not working</span>
</p>
<p>
06i. Simple module Javascript with src and type - interogation sign in path: <span class="status" id="span06i">This is not working</span>
</p>
<p>
06j. Simple module Javascript with src and type - interogation sign in path and querystring: <span class="status" id="span06j">This is not working</span>
</p>
<p>
07. Simple module Javascript with modulepreload: <span class="status" id="span07">This is not working</span>
</p>
<p>
08a. Simple module Javascript with importmap required: <span class="status" id="span08a">This is not working</span>
</p>
<p>
08b. Simple module Javascript with importmap required: <span class="status" id="span08b">This is not working</span>
</p>
<p>
08c. Simple module Javascript with importmap required: <span class="status" id="span08c">This is not working</span>
</p>
<p>
09a. Simple module Javascript with importmap required but nasty URL used in JS: <span class="status" id="span09a">This is not working</span>
</p>
<p>
09b. Simple module Javascript with importmap required but nasty URL used in JS: <span class="status" id="span09b">This is not working</span>
</p>
<p>
09c. Simple module Javascript with importmap required but nasty URL used in JS: <span class="status" id="span09c">This is not working</span>
</p>
<p>
09d. Simple module Javascript with importmap required but nasty URL used in JS: <span class="status" id="span09d">This is not working</span>
</p>
<script>
fetch("https://standard_hostname/javascript/content.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01a");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://not_standard_hostname_punny_encoded/javascript/content.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01b");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_hostname/javascript/contént.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01c");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch(" https://not_standard_hostname_punny_encoded/javascript/cont%C3%A9nt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01d");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_hostname/javascript/cont%F0%9F%8E%81nt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01e");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://not_standard_hostname_punny_encoded/javascript/cont%F0%9F%8E%81nt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01f");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_hostname/javascript/contént.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01g");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://not_standard_hostname_punny_encoded/javascript/contént.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01h");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_hostname/javascript/cont🎁nt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01i");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://not_standard_hostname_punny_encoded/javascript/cont🎁nt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01j");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://not_standard_hostname_not_encoded/javascript/content.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01k");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_netloc/javascript/content.txt?query=value")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01l");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_netloc/javascript/content.txt?query=valu%3De")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01l");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_netloc/javascript/content.txt?query=valu%25e")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01m");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_netloc/javascript/cont%3Fnt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01n");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("https://standard_netloc/javascript/cont%3Fnt.txt?query=value")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01o");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script>
fetch("./javascript/cont🎁nt.txt")
.then(function(response) {
response.text().then(function(text) {
const span = document.getElementById("span01p");
span.innerHTML=text;
span.classList.add("green");
});
});
</script>
<script src="./javascript/script02.js"></script>
<script type="text/javascript" src="./javascript/script03.js"></script>
<script src="./javascript/script05.js" defer></script>
<script type="module" src="./javascript/script06a.js"></script>
<script type="module" src="./javascript/script06b.js"></script>
<script type="module" src="./javascript/script06c.js"></script>
<script type="module" src="./javascript/script06d.js"></script>
<script type="module" src="./javascript/script06e.js"></script>
<script type="module" src="./javascript/script06f.js"></script>
<script type="module" src="./javascript/script06g.js"></script>
<script type="module" src="./javascript/script06h.js"></script>
<script type="module" src="./javascript/script06i.js"></script>
<script type="module" src="./javascript/script06j.js"></script>
<script type="module" src="./javascript/script07.js" defer></script>
<script type="module" src="./javascript/script08a.js"></script>
<script type="module" src="./javascript/script08b.js"></script>
<script type="module" src="./javascript/script08c.js"></script>
<script type="module" src="./javascript/script09a.js"></script>
<script type="module" src="./javascript/script09b.js"></script>
<script type="module" src="./javascript/script09c.js"></script>
<script type="module" src="./javascript/script09d.js"></script>
</body>
</html>

1
test-website/content/javascript/cont?nt.txt Normal file
View file

@ -0,0 +1 @@
This is working OK

1
test-website/content/javascript/content.txt Normal file
View file

@ -0,0 +1 @@
This is working OK

1
test-website/content/javascript/contént.txt Normal file
View file

@ -0,0 +1 @@
This is working OK

1
test-website/content/javascript/cont🎁nt.txt Normal file
View file

@ -0,0 +1 @@
This is working OK

7
test-website/content/javascript/r?sources.js Normal file
View file

@ -0,0 +1,7 @@
const okValue = 'This is working OK';
const otherValue = 'This is another value';
const okClass = 'green';
export {okClass, otherValue};
export default okValue;

7
test-website/content/javascript/resources.js Normal file
View file

@ -0,0 +1,7 @@
const okValue = 'This is working OK';
const otherValue = 'This is another value';
const okClass = 'green';
export {okClass, otherValue};
export default okValue;

7
test-website/content/javascript/résources.js Normal file
View file

@ -0,0 +1,7 @@
const okValue = 'This is working OK';
const otherValue = 'This is another value';
const okClass = 'green';
export {okClass, otherValue};
export default okValue;

3
test-website/content/javascript/script02.js Normal file
View file

@ -0,0 +1,3 @@
const span02 = document.getElementById("span02");
span02.innerHTML="This is working OK";
span02.classList.add("green");

3
test-website/content/javascript/script03.js Normal file
View file

@ -0,0 +1,3 @@
const span03 = document.getElementById("span03");
span03.innerHTML="This is working OK";
span03.classList.add("green");

5
test-website/content/javascript/script04.js Normal file
View file

@ -0,0 +1,5 @@
window.onload = function() {
const span04 = document.getElementById("span04");
span04.innerHTML="This is working OK";
span04.classList.add("green");
}

3
test-website/content/javascript/script05.js Normal file
View file

@ -0,0 +1,3 @@
const span05 = document.getElementById("span05");
span05.innerHTML="This is working OK";
span05.classList.add("green");

6
test-website/content/javascript/script06a.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './resources.js';
import { okClass } from './resources.js';
const span = document.getElementById("span06a");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06b.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './resources.js';
import { otherValue, okClass as myClass } from './resources.js';
const span = document.getElementById("span06b");
span.innerHTML=okValue;
span.classList.add(myClass);

6
test-website/content/javascript/script06c.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from '/javascript/resources.js';
import { okClass } from '/javascript/resources.js';
const span = document.getElementById("span06c");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06d.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from '../javascript/resources.js';
import { okClass } from '../javascript/resources.js';
const span = document.getElementById("span06d");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06e.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './résources.js';
import { okClass } from './résources.js';
const span = document.getElementById("span06e");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06f.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './resources.js?query=value';
import { okClass } from './resources.js?query=value';
const span = document.getElementById("span06f");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06g.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './resources.js?query=valu%3De';
import { okClass } from './resources.js?query=valu%3De';
const span = document.getElementById("span06g");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06h.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './resources.js?query=valu%25e';
import { okClass } from './resources.js?query=valu%25e';
const span = document.getElementById("span06h");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06i.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './r%3Fsources.js';
import { okClass } from './r%3Fsources.js';
const span = document.getElementById("span06i");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script06j.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './r%3Fsources.js?query=value';
import { okClass } from './r%3Fsources.js?query=value';
const span = document.getElementById("span06j");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script07.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from './resources.js';
import { okClass } from './resources.js';
const span = document.getElementById("span07");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script08a.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from 'resources';
import { okClass } from 'resources';
const span = document.getElementById("span08a");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script08b.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from 'javascript/resources';
import { okClass } from 'javascript/resources';
const span = document.getElementById("span08b");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script08c.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from '../javascript/resources';
import { okClass } from '../javascript/resources';
const span = document.getElementById("span08c");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script09a.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from 'https://example.com/resources';
import { okClass } from 'https://example.com/resources';
const span = document.getElementById("span09a");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script09b.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from 'https://standard_hostname/resources';
import { okClass } from 'https://standard_hostname/resources';
const span = document.getElementById("span09b");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script09c.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from 'https://not_standard_hostname_punny_encoded/resources';
import { okClass } from 'https://not_standard_hostname_punny_encoded/resources';
const span = document.getElementById("span09c");
span.innerHTML=okValue;
span.classList.add(okClass);

6
test-website/content/javascript/script09d.js Normal file
View file

@ -0,0 +1,6 @@
import okValue from 'https://not_standard_hostname_not_encoded/resources';
import { okClass } from 'https://not_standard_hostname_not_encoded/resources';
const span = document.getElementById("span09d");
span.innerHTML=okValue;
span.classList.add(okClass);

8
test-website/entrypoint-reverse.sh Normal file
View file

@ -0,0 +1,8 @@
#!/bin/bash
# Reverse the modifications done by entrypoint.sh ; usefull for local development when local directory is mounted inside the container
# for rapid tests but the modifications have to be reversed so that proper stuff is commited in Github
find /var/www/html -type f -exec sed -i 's/http:\/\/jédéacçents.local.oviles.info:8888/https:\/\/not_standard_hostname_not_encoded/g' {} \;
find /var/www/html -type f -exec sed -i 's/http:\/\/xn--jdacents-v0aqb.local.oviles.info:8888/https:\/\/not_standard_hostname_punny_encoded/g' {} \;
find /var/www/html -type f -exec sed -i 's/http:\/\/test-website.local.oviles.info:8888/https:\/\/standard_hostname/g' {} \;

6
test-website/entrypoint.sh
View file

@ -2,8 +2,8 @@
# Replace all occurences of hostnames in html files
find /var/www/html -type f -name '*.html' -exec sed -i "s/https:\/\/not_standard_hostname_not_encoded/$NOT_STANDARD_NETLOC_NOT_ENCODED/g" {} \;
find /var/www/html -type f -name '*.html' -exec sed -i "s/https:\/\/not_standard_hostname_punny_encoded/$NOT_STANDARD_NETLOC_PUNNY_ENCODED/g" {} \;
find /var/www/html -type f -name '*.html' -exec sed -i "s/https:\/\/standard_hostname/$STANDARD_NETLOC/g" {} \;
find /var/www/html -type f -exec sed -i "s/https:\/\/not_standard_hostname_not_encoded/$NOT_STANDARD_NETLOC_NOT_ENCODED/g" {} \;
find /var/www/html -type f -exec sed -i "s/https:\/\/not_standard_hostname_punny_encoded/$NOT_STANDARD_NETLOC_PUNNY_ENCODED/g" {} \;
find /var/www/html -type f -exec sed -i "s/https:\/\/standard_hostname/$STANDARD_NETLOC/g" {} \;
caddy run --config /etc/caddy/Caddyfile --adapter caddyfile