Fix: Revert v8-rc.4

package.json

@@ -240,7 +240,7 @@
     "magic-string": "^0.27.0",
     "npm-run-all": "^4.1.5",
     "open-cli": "^7.1.0",
-    "pixi.js": "^8.0.0-X",
+    "pixi.js": "8.0.0-rc.4",
     "pre-commit": "^1.2.2",
     "rimraf": "^4.1.1",
     "tslib": "^2.0.3",

scripts/screenshots/index.html

@@ -9,11 +9,19 @@
         padding: 0;
         width: 100vw; 
         height: 100vh;
-        background-color: #000000;
-        overflow: hidden;
-        display: flex;
-        justify-content: center;
-        align-items: center;
+        background-image:
+          linear-gradient(45deg, #ccc 25%, transparent 25%), 
+          linear-gradient(135deg, #ccc 25%, transparent 25%),
+          linear-gradient(45deg, transparent 75%, #ccc 75%),
+          linear-gradient(135deg, transparent 75%, #ccc 75%);
+        background-size:25px 25px; /* Must be a square */
+        background-position:0 0, 12.5px 0, 12.5px -12.5px, 0px 12.5px;
+        display: grid;
+        grid-template-columns: repeat(4, 1fr);
+      }
+      img, canvas {
+        width: 100%;
+        display: block;
       }
     </style>
   </head>

scripts/screenshots/renderer.js

@@ -27,6 +27,7 @@ app.init({
     backgroundColor: outputOptions.border.color,
     autoStart: false,
     preference: 'webgl',
+    hello: true,
 }).then(() =>
 {
     const frames = {};
@@ -70,7 +71,6 @@ app.init({
         preview.addChild(bg, fishes);
 
         app.stage.addChild(preview);
-        document.body.appendChild(app.canvas);
         next();
     });
 
@@ -144,6 +144,9 @@ app.init({
             {
                 app.render();
                 const base64 = await app.renderer.extract.base64(app.stage);
+                const img = new Image();
+                img.src = base64;
+                document.body.appendChild(img);
 
                 // Save image
                 base64ToImage(
@@ -158,6 +161,7 @@ app.init({
             {
                 app.render();
                 const canvas = app.renderer.extract.canvas(app.stage);
+                document.body.appendChild(canvas);
                 const context = canvas.getContext('2d');
 
                 context.scale(1, -1);