fix!: drop sync script retry support and remove document.write for white screen security (#18)

* fix!: remove the document.write for white screen security

* chore: update

* chore: update

Author: SoonIter

README.md

@@ -37,7 +37,7 @@ bun add @rsbuild/plugin-assets-retry -D
 You can register the plugin in the `rsbuild.config.ts` file:
 
 ```ts
-import { pluginAssetsRetry } from "@rsbuild/plugin-assets-retry";
+import { pluginAssetsRetry } from '@rsbuild/plugin-assets-retry';
 
 export default {
   plugins: [pluginAssetsRetry()],
@@ -64,7 +64,7 @@ type AssetsRetryOptions = {
   domain?: string[];
   max?: number;
   test?: string | ((url: string) => boolean);
-  crossOrigin?: boolean | "anonymous" | "use-credentials";
+  crossOrigin?: boolean | 'anonymous' | 'use-credentials';
   inlineScript?: boolean;
   delay?: number | ((context: AssetsRetryHookContext) => number);
   onRetry?: (context: AssetsRetryHookContext) => void;
@@ -77,10 +77,10 @@ type AssetsRetryOptions = {
 
 ```ts
 const defaultAssetsRetryOptions = {
-  type: ["script", "link", "img"],
+  type: ['script', 'link', 'img'],
   domain: [],
   max: 3,
-  test: "",
+  test: '',
   crossOrigin: false,
   delay: 0,
   onRetry: () => {},
@@ -103,11 +103,11 @@ For example:
 defineConfig({
   plugins: [
     pluginAssetsRetry({
-      domain: ["cdn1.com", "cdn2.com", "cdn3.com"],
-    })
+      domain: ['cdn1.com', 'cdn2.com', 'cdn3.com'],
+    }),
   ],
   output: {
-    assetPrefix: "https://cdn1.com", // or "//cdn1.com"
+    assetPrefix: 'https://cdn1.com', // or "//cdn1.com"
   },
 });
 ```
@@ -127,7 +127,7 @@ For example, only script tags and link tags are processed:
 
 ```js
 pluginAssetsRetry({
-  type: ["script", "link"],
+  type: ['script', 'link'],
 });
 ```
 
@@ -182,7 +182,7 @@ The callback function when the asset is being retried. For example:
 pluginAssetsRetry({
   onRetry: ({ times, domain, url, tagName, isAsyncChunk }) => {
     console.log(
-      `Retry ${times} times, domain: ${domain}, url: ${url}, tagName: ${tagName}, isAsyncChunk: ${isAsyncChunk}`
+      `Retry ${times} times, domain: ${domain}, url: ${url}, tagName: ${tagName}, isAsyncChunk: ${isAsyncChunk}`,
     );
   },
 });
@@ -198,7 +198,7 @@ The callback function when the asset is successfully retried. For example:
 pluginAssetsRetry({
   onSuccess: ({ times, domain, url, tagName, isAsyncChunk }) => {
     console.log(
-      `Retry ${times} times, domain: ${domain}, url: ${url}, tagName: ${tagName}, isAsyncChunk: ${isAsyncChunk}`
+      `Retry ${times} times, domain: ${domain}, url: ${url}, tagName: ${tagName}, isAsyncChunk: ${isAsyncChunk}`,
     );
   },
 });
@@ -214,7 +214,7 @@ The callback function when the asset is failed to be retried. For example:
 pluginAssetsRetry({
   onFail: ({ times, domain, url, tagName, isAsyncChunk }) => {
     console.log(
-      `Retry ${times} times, domain: ${domain}, url: ${url}, tagName: ${tagName}, isAsyncChunk: ${isAsyncChunk}`
+      `Retry ${times} times, domain: ${domain}, url: ${url}, tagName: ${tagName}, isAsyncChunk: ${isAsyncChunk}`,
     );
   },
 });
@@ -321,7 +321,7 @@ Or pass a function that receives `AssetsRetryHookContext` and returns the delay
 ```js
 // Calculate delay based on retry attempts
 pluginAssetsRetry({
-  delay: (ctx) => (ctx.times + 1) * 1000,
+  delay: ctx => (ctx.times + 1) * 1000,
 });
 ```
 
@@ -336,12 +336,12 @@ When you use Assets Retry plugin, the Rsbuild injects some runtime code into the
 Here's an example of incorrect usage:
 
 ```js
-import { someMethod } from "utils";
+import { someMethod } from 'utils';
 
 pluginAssetsRetry({
   onRetry() {
     // Incorrect usage, includes sensitive information
-    const privateToken = "a-private-token";
+    const privateToken = 'a-private-token';
 
     // Incorrect usage, uses an external method
     someMethod(privateToken);
@@ -353,6 +353,10 @@ pluginAssetsRetry({
 
 Assets Retry plugin may not work in the following scenarios:
 
+### Sync script tag loaded resources
+
+`<script src="..."></script>` tags load resources synchronously, and retrying them does not guarantee the order of resource loading. Therefore, the Assets Retry plugin will not retry resources loaded by synchronous script tags. It will only retry resources loaded by async/defer script tags.
+
 ### Module Federation
 
 For remote modules loaded by Module Federation, you can use the [@module-federation/retry-plugin](https://www.npmjs.com/package/@module-federation/retry-plugin) from Module Federation 2.0 to implement static asset retries.

README.zh-CN.md

@@ -351,6 +351,10 @@ pluginAssetsRetry({
 
 以下场景 Assets Retry 插件可能无法生效：
 
+### 同步 script 标签加载的资源
+
+`<script src="..."></script>` 标签加载的资源是同步加载的，如果进行重试无法保证资源加载的顺序，因此 Assets Retry 插件不会对同步加载的 script 标签进行重试。只会对 async/defer 的 script 标签进行重试。
+
 ### 模块联邦
 
 对于模块联邦加载的远程模块，你可以使用模块联邦 2.0 的 [@module-federation/retry-plugin](https://www.npmjs.com/package/@module-federation/retry-plugin) 来实现静态资源重试。

src/runtime/asyncChunkRetry.ts

@@ -1,3 +1,4 @@
+import { ERROR_PREFIX } from './constants.js';
 import {
   findCurrentDomain,
   findNextDomain,
@@ -174,8 +175,6 @@ const originalGetCssFilename =
   (() => null);
 const originalLoadScript = __RUNTIME_GLOBALS_LOAD_SCRIPT__;
 
-const ERROR_PREFIX = '[@rsbuild/plugin-assets-retry] ';
-
 // if users want to support es5, add Promise polyfill first https://github.com/webpack/webpack/issues/12877
 function ensureChunk(chunkId: string): Promise<unknown> {
   // biome-ignore lint/style/noArguments: allowed

src/runtime/constants.ts

@@ -0,0 +1 @@
+export const ERROR_PREFIX = '[@rsbuild/plugin-assets-retry] ';

src/runtime/initialChunkRetry.ts

@@ -1,4 +1,5 @@
 // rsbuild/runtime/initial-chunk-retry
+import { ERROR_PREFIX } from './constants.js';
 import {
   findCurrentDomain,
   findNextDomain,
@@ -31,18 +32,9 @@ function getRequestUrl(element: HTMLElement) {
     element instanceof HTMLScriptElement ||
     element instanceof HTMLImageElement
   ) {
-    // For <script src="" /> or <img src="" />
-    // element.getAttribute('src') === '' but element.src === baseURI
-    if (!element.getAttribute('src')?.trim()) {
-      return null;
-    }
     return element.src;
   }
   if (element instanceof HTMLLinkElement) {
-    // For <link href="" />
-    if (!element.getAttribute('href')?.trim()) {
-      return null;
-    }
     return element.href;
   }
   return null;
@@ -148,7 +140,11 @@ function reloadElementResource(
     if (attributes.isAsync) {
       document.body.appendChild(fresh.element);
     } else {
-      document.write(fresh.str);
+      console.warn(
+        ERROR_PREFIX,
+        'load sync script failed, for security only async/defer script can be retried',
+        origin,
+      );
     }
   }