diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index b20f8ad..825da06 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -9,12 +9,12 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout 🍔🍟🥤
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
         with:
           persist-credentials: false
 
       - name: Use Node.js 😂
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: 18
 
@@ -22,3 +22,9 @@ jobs:
         run: |
           npm ci
           npm run check-ci
+
+      - name: Upload Artifact ⬆️
+        uses: actions/upload-artifact@v4
+        with:
+          path: ./screenshots/*.png
+          overwrite: true
diff --git a/.gitignore b/.gitignore
index b3418f2..4a00e66 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,6 +4,7 @@
 
 /docs
 /dist
+/screenshots
 index.html
 
 # -- clip-for-deploy-end --
diff --git a/test/puppeteer.js b/test/puppeteer.js
index 1ec0678..ab96b54 100755
--- a/test/puppeteer.js
+++ b/test/puppeteer.js
@@ -32,6 +32,7 @@ function getExamples(port) {
       .map(f => ({
         url: `http://localhost:${port}/examples/${f}`,
         js: exampleInjectJS,
+        screenshot: true,
       }));
 }
 
@@ -71,7 +72,7 @@ async function test(port) {
     ...getExamples(port),
   ];
 
-  for (const {url, js} of testPages) {
+  for (const {url, js, screenshot} of testPages) {
     waitingPromiseInfo = makePromiseInfo();
     console.log(`===== [ ${url} ] =====`);
     if (js) {
@@ -87,9 +88,15 @@ async function test(port) {
       });
     }
     await waitingPromiseInfo.promise;
+    if (screenshot) {
+      const dir = 'screenshots';
+      fs.mkdirSync(dir, { recursive: true });
+      const name = /\/([a-z0-9_-]+).html/.exec(url)[1];
+      const path = `${dir}/${name}.png`;
+      await page.screenshot({path});
+    }
   }
 
-
   await browser.close();
   server.close();