@servicetitan/web-components 39.2.0 → 39.3.0

package/dist/common.d.ts

@@ -38,6 +38,7 @@ interface GetJsonOptions extends RequestInit {
     retryDelay?: number;
     onRequestError?(error: GetJsonError): void;
 }
+export declare function createNetworkError(message: string): Error;
 export declare function getJson<T = any>(url: string, { retries, retryDelay, onRequestError, ...config }?: GetJsonOptions): Promise<{
     data: T;
     headers: Headers;

package/dist/common.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../src/common.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD,MAAM,WAAW,2BAA2B;IACxC,YAAY,CAAC,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,SAAS,CAAA;KAAE,CAAC;CAC7D;AAED,eAAO,MAAM,cAAc,uDAAwC,CAAC;AACpE,eAAO,MAAM,0BAA0B,oEAEtC,CAAC;AACF,eAAO,MAAM,mCAAmC,4EAE/C,CAAC;AACF,eAAO,MAAM,sBAAsB,wDAAiD,CAAC;AACrF,eAAO,MAAM,iBAAiB,2DAA+C,CAAC;AAE9E,MAAM,WAAW,OAAO;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,aAAa;IAC1B,OAAO,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;CACnC;AAED,MAAM,WAAW,YAAY;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,cAAe,SAAQ,WAAW;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;CAC9C;AAUD,wBAAsB,OAAO,CAAC,CAAC,GAAG,GAAG,EACjC,GAAG,EAAE,MAAM,EACX,EAAE,OAAW,EAAE,UAAiB,EAAE,cAAc,EAAE,GAAG,MAAM,EAAE,GAAE,cAAmB,GACnF,OAAO,CAAC;IAAE,IAAI,EAAE,CAAC,CAAC;IAAC,OAAO,EAAE,OAAO,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC,CAiDrD"}
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../src/common.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oCAAoC,CAAC;AACpE,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD,MAAM,WAAW,2BAA2B;IACxC,YAAY,CAAC,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,SAAS,CAAA;KAAE,CAAC;CAC7D;AAED,eAAO,MAAM,cAAc,uDAAwC,CAAC;AACpE,eAAO,MAAM,0BAA0B,oEAEtC,CAAC;AACF,eAAO,MAAM,mCAAmC,4EAE/C,CAAC;AACF,eAAO,MAAM,sBAAsB,wDAAiD,CAAC;AACrF,eAAO,MAAM,iBAAiB,2DAA+C,CAAC;AAE9E,MAAM,WAAW,OAAO;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,aAAa;IAC1B,OAAO,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;CACnC;AAED,MAAM,WAAW,YAAY;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,cAAe,SAAQ,WAAW;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;CAC9C;AAED,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,MAAM,SAMjD;AAED,wBAAsB,OAAO,CAAC,CAAC,GAAG,GAAG,EACjC,GAAG,EAAE,MAAM,EACX,EAAE,OAAW,EAAE,UAAiB,EAAE,cAAc,EAAE,GAAG,MAAM,EAAE,GAAE,cAAmB,GACnF,OAAO,CAAC;IAAE,IAAI,EAAE,CAAC,CAAC;IAAC,OAAO,EAAE,OAAO,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC,CAiDrD"}

package/dist/common.js

@@ -4,7 +4,7 @@ export const EXPOSED_DEPENDENCIES_TOKEN = symbolToken('EXPOSED_DEPENDENCIES_TOKE
 export const EXPOSED_INSTANCE_DEPENDENCIES_TOKEN = symbolToken('EXPOSED_INSTANCE_DEPENDENCIES_TOKEN');
 export const IS_WEB_COMPONENT_TOKEN = symbolToken('IS_WEB_COMPONENT_TOKEN');
 export const RENDER_ROOT_TOKEN = symbolToken('RENDER_ROOT_TOKEN');
-function createNetworkError(message) {
+export function createNetworkError(message) {
     const error = new Error(message);
     error.name = 'NetworkError';
     return error;

package/dist/common.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/common.ts"],"sourcesContent":["import { type LDService } from '@servicetitan/launchdarkly-service';\nimport { Log } from '@servicetitan/log-service';\nimport { symbolToken } from '@servicetitan/react-ioc';\nimport { ExposedDependencies } from '@servicetitan/startup-utils';\nimport { EventBus } from './event-bus';\nimport { HistoryManager } from './history-manager';\n\nexport interface ExposedInstanceDependencies {\n    launchDarkly?: { version: string; ldService?: LDService };\n}\n\nexport const BASENAME_TOKEN = symbolToken<string>('BASENAME_TOKEN');\nexport const EXPOSED_DEPENDENCIES_TOKEN = symbolToken<ExposedDependencies>(\n    'EXPOSED_DEPENDENCIES_TOKEN'\n);\nexport const EXPOSED_INSTANCE_DEPENDENCIES_TOKEN = symbolToken<ExposedInstanceDependencies>(\n    'EXPOSED_INSTANCE_DEPENDENCIES_TOKEN'\n);\nexport const IS_WEB_COMPONENT_TOKEN = symbolToken<boolean>('IS_WEB_COMPONENT_TOKEN');\nexport const RENDER_ROOT_TOKEN = symbolToken<ShadowRoot>('RENDER_ROOT_TOKEN');\n\nexport interface Entries {\n    ldService?: LDService;\n    logService?: Log;\n    historyManager?: HistoryManager;\n    exposedDependencies?: ExposedDependencies;\n    exposedInstanceDependencies?: ExposedInstanceDependencies;\n    eventBus?: EventBus;\n    basename?: string;\n    onReady?: () => void;\n    onDispose?: () => void;\n}\n\nexport interface IWebComponent {\n    provide(entries: Entries): void;\n}\n\nexport interface GetJsonError {\n    status: number;\n    body: string;\n    json: object;\n}\n\ninterface GetJsonOptions extends RequestInit {\n    retries?: number;\n    retryDelay?: number;\n    onRequestError?(error: GetJsonError): void;\n}\n\nfunction createNetworkError(message: string) {\n    const error = new Error(message);\n\n    error.name = 'NetworkError';\n\n    return error;\n}\n\nexport async function getJson<T = any>(\n    url: string,\n    { retries = 5, retryDelay = 1000, onRequestError, ...config }: GetJsonOptions = {}\n): Promise<{ data: T; headers: Headers; url: string }> {\n    let response: Response;\n    try {\n        response = await fetch(url, config);\n    } catch {\n        if (retries > 0 && !config.signal?.aborted) {\n            return new Promise((resolve, reject) => {\n                const { signal } = config;\n\n                const timeoutId = window.setTimeout(() => {\n                    getJson(url, {\n                        ...config,\n                        onRequestError,\n                        retries: retries - 1,\n                        retryDelay: retryDelay * 4,\n                    }).then(resolve, reject);\n                }, retryDelay);\n\n                const abortHandler = () => {\n                    window.clearTimeout(timeoutId);\n                    signal?.removeEventListener('abort', abortHandler);\n                    reject(signal?.reason);\n                };\n\n                signal?.addEventListener('abort', abortHandler);\n            });\n        }\n\n        throw createNetworkError(`Failed to fetch: \"${url}\".`);\n    }\n\n    const responseJSON = await response.json().catch(() => ({}));\n\n    if (!response.ok) {\n        let message = `Requesting \"${url}\" failed with status code ${response.status}.`;\n\n        try {\n            message += ` Details: ${await response.text()}.`;\n        } catch {} // eslint-disable-line no-empty\n\n        onRequestError?.({\n            status: response.status,\n            json: responseJSON,\n            body: await response.text().catch(() => ''),\n        });\n        throw createNetworkError(message);\n    }\n\n    return { data: responseJSON, headers: response.headers, url: response.url ?? url };\n}\n"],"names":["symbolToken","BASENAME_TOKEN","EXPOSED_DEPENDENCIES_TOKEN","EXPOSED_INSTANCE_DEPENDENCIES_TOKEN","IS_WEB_COMPONENT_TOKEN","RENDER_ROOT_TOKEN","createNetworkError","message","error","Error","name","getJson","url","retries","retryDelay","onRequestError","config","response","fetch","signal","aborted","Promise","resolve","reject","timeoutId","window","setTimeout","then","abortHandler","clearTimeout","removeEventListener","reason","addEventListener","responseJSON","json","catch","ok","status","text","body","data","headers"],"mappings":"AAEA,SAASA,WAAW,QAAQ,0BAA0B;AAStD,OAAO,MAAMC,iBAAiBD,YAAoB,kBAAkB;AACpE,OAAO,MAAME,6BAA6BF,YACtC,8BACF;AACF,OAAO,MAAMG,sCAAsCH,YAC/C,uCACF;AACF,OAAO,MAAMI,yBAAyBJ,YAAqB,0BAA0B;AACrF,OAAO,MAAMK,oBAAoBL,YAAwB,qBAAqB;AA8B9E,SAASM,mBAAmBC,OAAe;IACvC,MAAMC,QAAQ,IAAIC,MAAMF;IAExBC,MAAME,IAAI,GAAG;IAEb,OAAOF;AACX;AAEA,OAAO,eAAeG,QAClBC,GAAW,EACX,EAAEC,UAAU,CAAC,EAAEC,aAAa,IAAI,EAAEC,cAAc,EAAE,GAAGC,QAAwB,GAAG,CAAC,CAAC;QAiDrBC;IA/C7D,IAAIA;IACJ,IAAI;QACAA,WAAW,MAAMC,MAAMN,KAAKI;IAChC,EAAE,eAAM;YACgBA;QAApB,IAAIH,UAAU,KAAK,GAACG,iBAAAA,OAAOG,MAAM,cAAbH,qCAAAA,eAAeI,OAAO,GAAE;YACxC,OAAO,IAAIC,QAAQ,CAACC,SAASC;gBACzB,MAAM,EAAEJ,MAAM,EAAE,GAAGH;gBAEnB,MAAMQ,YAAYC,OAAOC,UAAU,CAAC;oBAChCf,QAAQC,KAAK;wBACT,GAAGI,MAAM;wBACTD;wBACAF,SAASA,UAAU;wBACnBC,YAAYA,aAAa;oBAC7B,GAAGa,IAAI,CAACL,SAASC;gBACrB,GAAGT;gBAEH,MAAMc,eAAe;oBACjBH,OAAOI,YAAY,CAACL;oBACpBL,mBAAAA,6BAAAA,OAAQW,mBAAmB,CAAC,SAASF;oBACrCL,OAAOJ,mBAAAA,6BAAAA,OAAQY,MAAM;gBACzB;gBAEAZ,mBAAAA,6BAAAA,OAAQa,gBAAgB,CAAC,SAASJ;YACtC;QACJ;QAEA,MAAMtB,mBAAmB,CAAC,kBAAkB,EAAEM,IAAI,EAAE,CAAC;IACzD;IAEA,MAAMqB,eAAe,MAAMhB,SAASiB,IAAI,GAAGC,KAAK,CAAC,IAAO,CAAA,CAAC,CAAA;IAEzD,IAAI,CAAClB,SAASmB,EAAE,EAAE;QACd,IAAI7B,UAAU,CAAC,YAAY,EAAEK,IAAI,0BAA0B,EAAEK,SAASoB,MAAM,CAAC,CAAC,CAAC;QAE/E,IAAI;YACA9B,WAAW,CAAC,UAAU,EAAE,MAAMU,SAASqB,IAAI,GAAG,CAAC,CAAC;QACpD,EAAE,eAAM,CAAC,EAAE,+BAA+B;QAE1CvB,2BAAAA,qCAAAA,eAAiB;YACbsB,QAAQpB,SAASoB,MAAM;YACvBH,MAAMD;YACNM,MAAM,MAAMtB,SAASqB,IAAI,GAAGH,KAAK,CAAC,IAAM;QAC5C;QACA,MAAM7B,mBAAmBC;IAC7B;IAEA,OAAO;QAAEiC,MAAMP;QAAcQ,SAASxB,SAASwB,OAAO;QAAE7B,GAAG,GAAEK,gBAAAA,SAASL,GAAG,cAAZK,2BAAAA,gBAAgBL;IAAI;AACrF"}
+{"version":3,"sources":["../src/common.ts"],"sourcesContent":["import { type LDService } from '@servicetitan/launchdarkly-service';\nimport { Log } from '@servicetitan/log-service';\nimport { symbolToken } from '@servicetitan/react-ioc';\nimport { ExposedDependencies } from '@servicetitan/startup-utils';\nimport { EventBus } from './event-bus';\nimport { HistoryManager } from './history-manager';\n\nexport interface ExposedInstanceDependencies {\n    launchDarkly?: { version: string; ldService?: LDService };\n}\n\nexport const BASENAME_TOKEN = symbolToken<string>('BASENAME_TOKEN');\nexport const EXPOSED_DEPENDENCIES_TOKEN = symbolToken<ExposedDependencies>(\n    'EXPOSED_DEPENDENCIES_TOKEN'\n);\nexport const EXPOSED_INSTANCE_DEPENDENCIES_TOKEN = symbolToken<ExposedInstanceDependencies>(\n    'EXPOSED_INSTANCE_DEPENDENCIES_TOKEN'\n);\nexport const IS_WEB_COMPONENT_TOKEN = symbolToken<boolean>('IS_WEB_COMPONENT_TOKEN');\nexport const RENDER_ROOT_TOKEN = symbolToken<ShadowRoot>('RENDER_ROOT_TOKEN');\n\nexport interface Entries {\n    ldService?: LDService;\n    logService?: Log;\n    historyManager?: HistoryManager;\n    exposedDependencies?: ExposedDependencies;\n    exposedInstanceDependencies?: ExposedInstanceDependencies;\n    eventBus?: EventBus;\n    basename?: string;\n    onReady?: () => void;\n    onDispose?: () => void;\n}\n\nexport interface IWebComponent {\n    provide(entries: Entries): void;\n}\n\nexport interface GetJsonError {\n    status: number;\n    body: string;\n    json: object;\n}\n\ninterface GetJsonOptions extends RequestInit {\n    retries?: number;\n    retryDelay?: number;\n    onRequestError?(error: GetJsonError): void;\n}\n\nexport function createNetworkError(message: string) {\n    const error = new Error(message);\n\n    error.name = 'NetworkError';\n\n    return error;\n}\n\nexport async function getJson<T = any>(\n    url: string,\n    { retries = 5, retryDelay = 1000, onRequestError, ...config }: GetJsonOptions = {}\n): Promise<{ data: T; headers: Headers; url: string }> {\n    let response: Response;\n    try {\n        response = await fetch(url, config);\n    } catch {\n        if (retries > 0 && !config.signal?.aborted) {\n            return new Promise((resolve, reject) => {\n                const { signal } = config;\n\n                const timeoutId = window.setTimeout(() => {\n                    getJson(url, {\n                        ...config,\n                        onRequestError,\n                        retries: retries - 1,\n                        retryDelay: retryDelay * 4,\n                    }).then(resolve, reject);\n                }, retryDelay);\n\n                const abortHandler = () => {\n                    window.clearTimeout(timeoutId);\n                    signal?.removeEventListener('abort', abortHandler);\n                    reject(signal?.reason);\n                };\n\n                signal?.addEventListener('abort', abortHandler);\n            });\n        }\n\n        throw createNetworkError(`Failed to fetch: \"${url}\".`);\n    }\n\n    const responseJSON = await response.json().catch(() => ({}));\n\n    if (!response.ok) {\n        let message = `Requesting \"${url}\" failed with status code ${response.status}.`;\n\n        try {\n            message += ` Details: ${await response.text()}.`;\n        } catch {} // eslint-disable-line no-empty\n\n        onRequestError?.({\n            status: response.status,\n            json: responseJSON,\n            body: await response.text().catch(() => ''),\n        });\n        throw createNetworkError(message);\n    }\n\n    return { data: responseJSON, headers: response.headers, url: response.url ?? url };\n}\n"],"names":["symbolToken","BASENAME_TOKEN","EXPOSED_DEPENDENCIES_TOKEN","EXPOSED_INSTANCE_DEPENDENCIES_TOKEN","IS_WEB_COMPONENT_TOKEN","RENDER_ROOT_TOKEN","createNetworkError","message","error","Error","name","getJson","url","retries","retryDelay","onRequestError","config","response","fetch","signal","aborted","Promise","resolve","reject","timeoutId","window","setTimeout","then","abortHandler","clearTimeout","removeEventListener","reason","addEventListener","responseJSON","json","catch","ok","status","text","body","data","headers"],"mappings":"AAEA,SAASA,WAAW,QAAQ,0BAA0B;AAStD,OAAO,MAAMC,iBAAiBD,YAAoB,kBAAkB;AACpE,OAAO,MAAME,6BAA6BF,YACtC,8BACF;AACF,OAAO,MAAMG,sCAAsCH,YAC/C,uCACF;AACF,OAAO,MAAMI,yBAAyBJ,YAAqB,0BAA0B;AACrF,OAAO,MAAMK,oBAAoBL,YAAwB,qBAAqB;AA8B9E,OAAO,SAASM,mBAAmBC,OAAe;IAC9C,MAAMC,QAAQ,IAAIC,MAAMF;IAExBC,MAAME,IAAI,GAAG;IAEb,OAAOF;AACX;AAEA,OAAO,eAAeG,QAClBC,GAAW,EACX,EAAEC,UAAU,CAAC,EAAEC,aAAa,IAAI,EAAEC,cAAc,EAAE,GAAGC,QAAwB,GAAG,CAAC,CAAC;QAiDrBC;IA/C7D,IAAIA;IACJ,IAAI;QACAA,WAAW,MAAMC,MAAMN,KAAKI;IAChC,EAAE,eAAM;YACgBA;QAApB,IAAIH,UAAU,KAAK,GAACG,iBAAAA,OAAOG,MAAM,cAAbH,qCAAAA,eAAeI,OAAO,GAAE;YACxC,OAAO,IAAIC,QAAQ,CAACC,SAASC;gBACzB,MAAM,EAAEJ,MAAM,EAAE,GAAGH;gBAEnB,MAAMQ,YAAYC,OAAOC,UAAU,CAAC;oBAChCf,QAAQC,KAAK;wBACT,GAAGI,MAAM;wBACTD;wBACAF,SAASA,UAAU;wBACnBC,YAAYA,aAAa;oBAC7B,GAAGa,IAAI,CAACL,SAASC;gBACrB,GAAGT;gBAEH,MAAMc,eAAe;oBACjBH,OAAOI,YAAY,CAACL;oBACpBL,mBAAAA,6BAAAA,OAAQW,mBAAmB,CAAC,SAASF;oBACrCL,OAAOJ,mBAAAA,6BAAAA,OAAQY,MAAM;gBACzB;gBAEAZ,mBAAAA,6BAAAA,OAAQa,gBAAgB,CAAC,SAASJ;YACtC;QACJ;QAEA,MAAMtB,mBAAmB,CAAC,kBAAkB,EAAEM,IAAI,EAAE,CAAC;IACzD;IAEA,MAAMqB,eAAe,MAAMhB,SAASiB,IAAI,GAAGC,KAAK,CAAC,IAAO,CAAA,CAAC,CAAA;IAEzD,IAAI,CAAClB,SAASmB,EAAE,EAAE;QACd,IAAI7B,UAAU,CAAC,YAAY,EAAEK,IAAI,0BAA0B,EAAEK,SAASoB,MAAM,CAAC,CAAC,CAAC;QAE/E,IAAI;YACA9B,WAAW,CAAC,UAAU,EAAE,MAAMU,SAASqB,IAAI,GAAG,CAAC,CAAC;QACpD,EAAE,eAAM,CAAC,EAAE,+BAA+B;QAE1CvB,2BAAAA,qCAAAA,eAAiB;YACbsB,QAAQpB,SAASoB,MAAM;YACvBH,MAAMD;YACNM,MAAM,MAAMtB,SAASqB,IAAI,GAAGH,KAAK,CAAC,IAAM;QAC5C;QACA,MAAM7B,mBAAmBC;IAC7B;IAEA,OAAO;QAAEiC,MAAMP;QAAcQ,SAASxB,SAASwB,OAAO;QAAE7B,GAAG,GAAEK,gBAAAA,SAASL,GAAG,cAAZK,2BAAAA,gBAAgBL;IAAI;AACrF"}

package/dist/utils/load-scripts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"load-scripts.d.ts","sourceRoot":"","sources":["../../src/utils/load-scripts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,EAAE,UAAU,mBAwCrE"}
+{"version":3,"file":"load-scripts.d.ts","sourceRoot":"","sources":["../../src/utils/load-scripts.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/C,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,EAAE,EAAE,UAAU,mBAwDrE"}

package/dist/utils/load-scripts.js

@@ -1,8 +1,9 @@
+import { createNetworkError } from '../common';
 export function loadScripts({ urls, WebComponent, module }) {
     return Promise.all(urls.js.map((url)=>{
         const script = Array.from(document.scripts).find(({ src })=>src === url);
         if (!script) {
-            return new Promise((resolve)=>{
+            return new Promise((resolve, reject)=>{
                 const script = document.createElement('script');
                 if (module) {
                     script.type = 'module';
@@ -13,20 +14,35 @@ export function loadScripts({ urls, WebComponent, module }) {
                 script.onload = ()=>{
                     script.dataset.webComponent = WebComponent;
                     script.onload = null;
+                    script.onerror = null;
                     resolve();
                 };
+                script.onerror = ()=>{
+                    /*
+                         * Remove the failed script so a later remount can retry
+                         * instead of waiting on it forever.
+                         */ script.remove();
+                    reject(createNetworkError(`Failed to load script: "${url}".`));
+                };
                 script.src = url;
                 document.body.append(script);
             });
         }
         if (!script.dataset.webComponent) {
-            return new Promise((resolve)=>{
+            return new Promise((resolve, reject)=>{
                 const originalOnload = script.onload;
+                const originalOnerror = script.onerror;
                 script.onload = (...args)=>{
                     originalOnload === null || originalOnload === void 0 ? void 0 : originalOnload.call(script, ...args);
                     script.onload = null;
+                    script.onerror = null;
                     resolve();
                 };
+                script.onerror = (...args)=>{
+                    originalOnerror === null || originalOnerror === void 0 ? void 0 : originalOnerror.call(script, ...args);
+                    script.remove();
+                    reject(createNetworkError(`Failed to load script: "${url}".`));
+                };
             });
         }
         return Promise.resolve();

package/dist/utils/load-scripts.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/load-scripts.ts"],"sourcesContent":["import { BundleInfo } from './get-bundle-info';\n\nexport function loadScripts({ urls, WebComponent, module }: BundleInfo) {\n    return Promise.all(\n        urls.js.map(url => {\n            const script = Array.from(document.scripts).find(({ src }) => src === url);\n            if (!script) {\n                return new Promise<void>(resolve => {\n                    const script = document.createElement('script');\n\n                    if (module) {\n                        script.type = 'module';\n                    } else {\n                        script.async = true;\n                    }\n\n                    script.crossOrigin = 'anonymous';\n                    script.onload = () => {\n                        script.dataset.webComponent = WebComponent;\n                        script.onload = null;\n                        resolve();\n                    };\n                    script.src = url;\n\n                    document.body.append(script);\n                });\n            }\n\n            if (!script.dataset.webComponent) {\n                return new Promise<void>(resolve => {\n                    const originalOnload = script.onload;\n                    script.onload = (...args) => {\n                        originalOnload?.call(script, ...args);\n                        script.onload = null;\n                        resolve();\n                    };\n                });\n            }\n\n            return Promise.resolve();\n        })\n    );\n}\n"],"names":["loadScripts","urls","WebComponent","module","Promise","all","js","map","url","script","Array","from","document","scripts","find","src","resolve","createElement","type","async","crossOrigin","onload","dataset","webComponent","body","append","originalOnload","args","call"],"mappings":"AAEA,OAAO,SAASA,YAAY,EAAEC,IAAI,EAAEC,YAAY,EAAEC,MAAM,EAAc;IAClE,OAAOC,QAAQC,GAAG,CACdJ,KAAKK,EAAE,CAACC,GAAG,CAACC,CAAAA;QACR,MAAMC,SAASC,MAAMC,IAAI,CAACC,SAASC,OAAO,EAAEC,IAAI,CAAC,CAAC,EAAEC,GAAG,EAAE,GAAKA,QAAQP;QACtE,IAAI,CAACC,QAAQ;YACT,OAAO,IAAIL,QAAcY,CAAAA;gBACrB,MAAMP,SAASG,SAASK,aAAa,CAAC;gBAEtC,IAAId,QAAQ;oBACRM,OAAOS,IAAI,GAAG;gBAClB,OAAO;oBACHT,OAAOU,KAAK,GAAG;gBACnB;gBAEAV,OAAOW,WAAW,GAAG;gBACrBX,OAAOY,MAAM,GAAG;oBACZZ,OAAOa,OAAO,CAACC,YAAY,GAAGrB;oBAC9BO,OAAOY,MAAM,GAAG;oBAChBL;gBACJ;gBACAP,OAAOM,GAAG,GAAGP;gBAEbI,SAASY,IAAI,CAACC,MAAM,CAAChB;YACzB;QACJ;QAEA,IAAI,CAACA,OAAOa,OAAO,CAACC,YAAY,EAAE;YAC9B,OAAO,IAAInB,QAAcY,CAAAA;gBACrB,MAAMU,iBAAiBjB,OAAOY,MAAM;gBACpCZ,OAAOY,MAAM,GAAG,CAAC,GAAGM;oBAChBD,2BAAAA,qCAAAA,eAAgBE,IAAI,CAACnB,WAAWkB;oBAChClB,OAAOY,MAAM,GAAG;oBAChBL;gBACJ;YACJ;QACJ;QAEA,OAAOZ,QAAQY,OAAO;IAC1B;AAER"}
+{"version":3,"sources":["../../src/utils/load-scripts.ts"],"sourcesContent":["import { createNetworkError } from '../common';\nimport { BundleInfo } from './get-bundle-info';\n\nexport function loadScripts({ urls, WebComponent, module }: BundleInfo) {\n    return Promise.all(\n        urls.js.map(url => {\n            const script = Array.from(document.scripts).find(({ src }) => src === url);\n            if (!script) {\n                return new Promise<void>((resolve, reject) => {\n                    const script = document.createElement('script');\n\n                    if (module) {\n                        script.type = 'module';\n                    } else {\n                        script.async = true;\n                    }\n\n                    script.crossOrigin = 'anonymous';\n                    script.onload = () => {\n                        script.dataset.webComponent = WebComponent;\n                        script.onload = null;\n                        script.onerror = null;\n                        resolve();\n                    };\n                    script.onerror = () => {\n                        /*\n                         * Remove the failed script so a later remount can retry\n                         * instead of waiting on it forever.\n                         */\n                        script.remove();\n                        reject(createNetworkError(`Failed to load script: \"${url}\".`));\n                    };\n                    script.src = url;\n\n                    document.body.append(script);\n                });\n            }\n\n            if (!script.dataset.webComponent) {\n                return new Promise<void>((resolve, reject) => {\n                    const originalOnload = script.onload;\n                    const originalOnerror = script.onerror;\n                    script.onload = (...args) => {\n                        originalOnload?.call(script, ...args);\n                        script.onload = null;\n                        script.onerror = null;\n                        resolve();\n                    };\n                    script.onerror = (...args) => {\n                        originalOnerror?.call(script, ...args);\n                        script.remove();\n                        reject(createNetworkError(`Failed to load script: \"${url}\".`));\n                    };\n                });\n            }\n\n            return Promise.resolve();\n        })\n    );\n}\n"],"names":["createNetworkError","loadScripts","urls","WebComponent","module","Promise","all","js","map","url","script","Array","from","document","scripts","find","src","resolve","reject","createElement","type","async","crossOrigin","onload","dataset","webComponent","onerror","remove","body","append","originalOnload","originalOnerror","args","call"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,YAAY;AAG/C,OAAO,SAASC,YAAY,EAAEC,IAAI,EAAEC,YAAY,EAAEC,MAAM,EAAc;IAClE,OAAOC,QAAQC,GAAG,CACdJ,KAAKK,EAAE,CAACC,GAAG,CAACC,CAAAA;QACR,MAAMC,SAASC,MAAMC,IAAI,CAACC,SAASC,OAAO,EAAEC,IAAI,CAAC,CAAC,EAAEC,GAAG,EAAE,GAAKA,QAAQP;QACtE,IAAI,CAACC,QAAQ;YACT,OAAO,IAAIL,QAAc,CAACY,SAASC;gBAC/B,MAAMR,SAASG,SAASM,aAAa,CAAC;gBAEtC,IAAIf,QAAQ;oBACRM,OAAOU,IAAI,GAAG;gBAClB,OAAO;oBACHV,OAAOW,KAAK,GAAG;gBACnB;gBAEAX,OAAOY,WAAW,GAAG;gBACrBZ,OAAOa,MAAM,GAAG;oBACZb,OAAOc,OAAO,CAACC,YAAY,GAAGtB;oBAC9BO,OAAOa,MAAM,GAAG;oBAChBb,OAAOgB,OAAO,GAAG;oBACjBT;gBACJ;gBACAP,OAAOgB,OAAO,GAAG;oBACb;;;yBAGC,GACDhB,OAAOiB,MAAM;oBACbT,OAAOlB,mBAAmB,CAAC,wBAAwB,EAAES,IAAI,EAAE,CAAC;gBAChE;gBACAC,OAAOM,GAAG,GAAGP;gBAEbI,SAASe,IAAI,CAACC,MAAM,CAACnB;YACzB;QACJ;QAEA,IAAI,CAACA,OAAOc,OAAO,CAACC,YAAY,EAAE;YAC9B,OAAO,IAAIpB,QAAc,CAACY,SAASC;gBAC/B,MAAMY,iBAAiBpB,OAAOa,MAAM;gBACpC,MAAMQ,kBAAkBrB,OAAOgB,OAAO;gBACtChB,OAAOa,MAAM,GAAG,CAAC,GAAGS;oBAChBF,2BAAAA,qCAAAA,eAAgBG,IAAI,CAACvB,WAAWsB;oBAChCtB,OAAOa,MAAM,GAAG;oBAChBb,OAAOgB,OAAO,GAAG;oBACjBT;gBACJ;gBACAP,OAAOgB,OAAO,GAAG,CAAC,GAAGM;oBACjBD,4BAAAA,sCAAAA,gBAAiBE,IAAI,CAACvB,WAAWsB;oBACjCtB,OAAOiB,MAAM;oBACbT,OAAOlB,mBAAmB,CAAC,wBAAwB,EAAES,IAAI,EAAE,CAAC;gBAChE;YACJ;QACJ;QAEA,OAAOJ,QAAQY,OAAO;IAC1B;AAER"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@servicetitan/web-components",
-    "version": "39.2.0",
+    "version": "39.3.0",
     "description": "Framework to build, register, and load Microfrontends into host applications",
     "homepage": "https://docs.st.dev/docs/frontend/uikit/web-components",
     "repository": {
@@ -31,18 +31,18 @@
         "src"
     ],
     "dependencies": {
-        "@servicetitan/error-boundary": "39.2.0",
-        "@servicetitan/startup-utils": "39.2.0",
+        "@servicetitan/error-boundary": "39.3.0",
+        "@servicetitan/startup-utils": "39.3.0",
         "lodash.get": "~4.4.2",
         "mitt": "~3.0.1",
         "semver": "~7.8.5"
     },
     "devDependencies": {
-        "@servicetitan/anvil2": "^3.13.2",
+        "@servicetitan/anvil2": "^3.13.3",
         "@servicetitan/design-system": "~14.5.3",
-        "@servicetitan/launchdarkly-service": "39.2.0",
-        "@servicetitan/log-service": "39.2.0",
-        "@servicetitan/react-ioc": "39.2.0",
+        "@servicetitan/launchdarkly-service": "39.3.0",
+        "@servicetitan/log-service": "39.3.0",
+        "@servicetitan/react-ioc": "39.3.0",
         "@testing-library/dom": "^10.4.1",
         "@testing-library/jest-dom": "^7.0.1",
         "@testing-library/react": "^16.3.3",
@@ -60,9 +60,9 @@
     "peerDependencies": {
         "@servicetitan/anvil2": ">=1.5.0",
         "@servicetitan/design-system": ">=14.5.3",
-        "@servicetitan/launchdarkly-service": "39.2.0",
-        "@servicetitan/log-service": "39.2.0",
-        "@servicetitan/react-ioc": "39.2.0",
+        "@servicetitan/launchdarkly-service": "39.3.0",
+        "@servicetitan/log-service": "39.3.0",
+        "@servicetitan/react-ioc": "39.3.0",
         "history": "~4.10.1",
         "react": ">=17.0.2",
         "react-dom": ">=17.0.2"

package/src/__tests__/loader.test.tsx

@@ -48,6 +48,7 @@ describe('[web-components] Loader', () => {
 
     let props: LoaderProps<any>;
     let onloadRef: Function | null;
+    let onerrorRef: Function | null;
     let singletons: ProviderProps['singletons'];
     let getJsonMockFns: Record<string, Function>;
 
@@ -62,8 +63,8 @@ describe('[web-components] Loader', () => {
         window.customElements.define(WEB_COMPONENT_NAME, WebComponent);
 
         /*
-         * mock <script>'s onload so that we can call it directly from the test,
-         * because it won't call itself in the test environment
+         * mock <script>'s onload/onerror so that we can call them directly from the test,
+         * because they won't call themselves in the test environment
          */
         Object.defineProperty(HTMLScriptElement.prototype, 'onload', {
             get() {
@@ -74,6 +75,15 @@ describe('[web-components] Loader', () => {
                 this._onload = onload;
             },
         });
+        Object.defineProperty(HTMLScriptElement.prototype, 'onerror', {
+            get() {
+                return this._onerror;
+            },
+            set(onerror: Function) {
+                onerrorRef = onerror;
+                this._onerror = onerror;
+            },
+        });
     });
 
     function initializeGetJsonMockFns(url = baseUrl) {
@@ -113,6 +123,7 @@ describe('[web-components] Loader', () => {
         setStartupVersion('27.2.0');
         props = { src: baseUrl, cache: false };
         onloadRef = null;
+        onerrorRef = null;
         singletons = [];
         initializeGetJsonMockFns();
 
@@ -152,6 +163,52 @@ describe('[web-components] Loader', () => {
         expect(common.getJson).toHaveBeenCalledTimes(1);
     }
 
+    function itRendersErrorFallback(triggerFailure?: () => void | Promise<void>) {
+        beforeEach(() => {
+            jest.spyOn(console, 'error').mockImplementation(jest.fn); // suppress error boundary logging
+        });
+
+        test('renders default error fallback', async () => {
+            subject();
+            await triggerFailure?.();
+
+            await waitFor(() =>
+                expect(screen.getByText('Something went wrong')).toBeInTheDocument()
+            );
+        });
+
+        describe.each(localHosts)('when src contains "%s"', host => {
+            beforeEach(() => {
+                props.src = `http://${host}/mfe`;
+                initializeGetJsonMockFns(props.src);
+            });
+
+            test('appends src to error fallback', async () => {
+                subject();
+                await triggerFailure?.();
+
+                await waitFor(() =>
+                    expect(
+                        screen.getByText(`Something went wrong loading ${props.src}`)
+                    ).toBeInTheDocument()
+                );
+            });
+        });
+
+        describe('when an errorFallback is provided', () => {
+            beforeEach(() => {
+                props.errorFallback = <div>bar</div>;
+            });
+
+            test('renders provided error fallback', async () => {
+                subject();
+                await triggerFailure?.();
+
+                await waitFor(() => expect(screen.getByText('bar')).toBeInTheDocument());
+            });
+        });
+    }
+
     describe.each(localHosts)('when src contains "%s"', host => {
         beforeEach(() => {
             props.src = `http://${host}/mfe`;
@@ -211,49 +268,13 @@ describe('[web-components] Loader', () => {
 
     describe('when the loadingFallback throws an error', () => {
         beforeEach(() => {
-            jest.spyOn(console, 'error').mockImplementation(jest.fn); // suppress console output
             const ThrowError: FC = () => {
                 throw new Error('woops');
             };
             props.loadingFallback = <ThrowError />;
         });
 
-        test('renders default error fallback', async () => {
-            subject();
-
-            await waitFor(() =>
-                expect(screen.getByText('Something went wrong')).toBeInTheDocument()
-            );
-        });
-
-        describe.each(localHosts)('when src contains "%s"', host => {
-            beforeEach(() => {
-                props.src = `http://${host}/mfe`;
-                initializeGetJsonMockFns(props.src);
-            });
-
-            test('appends src to error fallback', async () => {
-                subject();
-
-                await waitFor(() =>
-                    expect(
-                        screen.getByText(`Something went wrong loading ${props.src}`)
-                    ).toBeInTheDocument()
-                );
-            });
-        });
-
-        describe('when an errorFallback is provided', () => {
-            beforeEach(() => {
-                props.errorFallback = <div>bar</div>;
-            });
-
-            test('renders provided error fallback', async () => {
-                subject();
-
-                await waitFor(() => expect(screen.getByText('bar')).toBeInTheDocument());
-            });
-        });
+        itRendersErrorFallback();
     });
 
     describe('when loadingFallback is not delayed', () => {
@@ -863,11 +884,6 @@ describe('[web-components] Loader', () => {
                     document.body.appendChild(script);
                 });
 
-                test("the script tag's original onload is called", async () => {
-                    await webComponentReadySetup();
-                    expect(originalOnloadSpy).toHaveBeenCalled();
-                });
-
                 test('onload handler gets unassigned after it gets called', async () => {
                     await webComponentReadySetup();
                     expect(onloadRef).toBeNull();
@@ -980,6 +996,28 @@ describe('[web-components] Loader', () => {
         });
     });
 
+    describe('when the script tag fails to load', () => {
+        beforeEach(() => {
+            jest.spyOn(console, 'error').mockImplementation(jest.fn); // suppress error boundary logging
+        });
+
+        async function triggerScriptError() {
+            await waitFor(() => onerrorRef !== null);
+            act(() => {
+                onerrorRef!();
+            });
+        }
+
+        itRendersErrorFallback(triggerScriptError);
+
+        test('does not hang on the loading fallback', async () => {
+            subject();
+            await triggerScriptError();
+
+            await waitFor(() => expect(screen.queryByText(/loading/i)).not.toBeInTheDocument());
+        });
+    });
+
     describe('when cache is enabled', () => {
         beforeAll(() => {
             jest.useFakeTimers();

package/src/common.ts

@@ -47,7 +47,7 @@ interface GetJsonOptions extends RequestInit {
     onRequestError?(error: GetJsonError): void;
 }
 
-function createNetworkError(message: string) {
+export function createNetworkError(message: string) {
     const error = new Error(message);
 
     error.name = 'NetworkError';

package/src/utils/__tests__/load-scripts.test.ts

@@ -0,0 +1,172 @@
+import '@testing-library/jest-dom';
+import { BundleInfo } from '../get-bundle-info';
+import { loadScripts } from '../load-scripts';
+
+describe('[web-components] loadScripts', () => {
+    const url = 'https://unpkg.servicetitan.com/mfe/dist/bundle/light/light.js';
+    const webComponentName = 'my-mfe';
+
+    let bundleInfo: BundleInfo;
+    let onloadRef: (() => void) | null;
+    let onerrorRef: (() => void) | null;
+
+    beforeAll(() => {
+        /*
+         * mock <script>'s onload/onerror so that we can call them directly from the test,
+         * because they won't call themselves in the test environment
+         */
+        Object.defineProperty(HTMLScriptElement.prototype, 'onload', {
+            configurable: true,
+            get() {
+                return this._onload;
+            },
+            set(onload) {
+                onloadRef = onload;
+                this._onload = onload;
+            },
+        });
+        Object.defineProperty(HTMLScriptElement.prototype, 'onerror', {
+            configurable: true,
+            get() {
+                return this._onerror;
+            },
+            set(onerror) {
+                onerrorRef = onerror;
+                this._onerror = onerror;
+            },
+        });
+    });
+
+    beforeEach(() => {
+        document.querySelectorAll('script').forEach(script => script.remove());
+        onloadRef = null;
+        onerrorRef = null;
+        bundleInfo = {
+            bundledWith: undefined,
+            cacheHit: undefined,
+            disposer: () => {},
+            mfeSupportsRerendering: false,
+            mfeHasUniqueChunkNamespace: false,
+            mfeHasCompatibleLaunchDarklyVersion: false,
+            mismatch: undefined,
+            resolvedBundleType: 'light',
+            urls: { js: [url], css: [] },
+            WebComponent: webComponentName,
+            version: undefined,
+            module: undefined,
+        };
+    });
+
+    const subject = () => loadScripts(bundleInfo);
+
+    function scriptTag() {
+        return document.querySelector(`script[src="${url}"]`) as HTMLScriptElement | null;
+    }
+
+    test('creates a script tag for the js url', () => {
+        subject();
+
+        expect(scriptTag()).toBeInTheDocument();
+    });
+
+    test('sets crossOrigin to anonymous', () => {
+        subject();
+
+        expect(scriptTag()).toHaveAttribute('crossorigin', 'anonymous');
+    });
+
+    describe('when the script loads successfully', () => {
+        const subject = () => {
+            const promise = loadScripts(bundleInfo);
+            onloadRef!();
+            return promise;
+        };
+
+        test('resolves', async () => {
+            await expect(subject()).resolves.toEqual([undefined]);
+        });
+
+        test('marks the script tag with the web component name', async () => {
+            await subject();
+
+            expect(scriptTag()).toHaveAttribute('data-web-component', webComponentName);
+        });
+
+        test('unassigns the onload and onerror handlers', async () => {
+            await subject();
+
+            expect(scriptTag()!.onload).toBeNull();
+            expect(scriptTag()!.onerror).toBeNull();
+        });
+    });
+
+    describe('when the script fails to load', () => {
+        const subject = () => {
+            const promise = loadScripts(bundleInfo);
+            onerrorRef!();
+            return promise;
+        };
+
+        test('rejects with a network error', async () => {
+            await expect(subject()).rejects.toThrow(`Failed to load script: "${url}".`);
+        });
+
+        test('removes the failed script tag from the DOM', async () => {
+            await subject().catch(() => {});
+
+            expect(scriptTag()).not.toBeInTheDocument();
+        });
+    });
+
+    describe('when a script tag for this bundle already exists without a webComponent data attribute', () => {
+        let originalOnloadSpy: jest.Mock;
+        let originalOnerrorSpy: jest.Mock;
+
+        beforeEach(() => {
+            originalOnloadSpy = jest.fn();
+            originalOnerrorSpy = jest.fn();
+
+            const script = document.createElement('script');
+            script.src = url;
+            script.onload = originalOnloadSpy;
+            script.onerror = originalOnerrorSpy;
+            document.body.appendChild(script);
+        });
+
+        const subject = () => {
+            const promise = loadScripts(bundleInfo);
+            onloadRef!();
+            return promise;
+        };
+
+        test('calls the original onload handler', async () => {
+            await subject();
+
+            expect(originalOnloadSpy).toHaveBeenCalled();
+        });
+
+        describe('when the script fails to load', () => {
+            const subject = () => {
+                const promise = loadScripts(bundleInfo);
+                onerrorRef!();
+                return promise;
+            };
+
+            test('calls the original onerror handler', async () => {
+                await subject().catch(() => {});
+
+                expect(originalOnerrorSpy).toHaveBeenCalled();
+            });
+
+            test('rejects with a network error', async () => {
+                await expect(subject()).rejects.toThrow(`Failed to load script: "${url}".`);
+            });
+
+            test('removes the failed script tag from the DOM', async () => {
+                await subject().catch(() => {});
+
+                expect(scriptTag()).not.toBeInTheDocument();
+            });
+        });
+    });
+});

package/src/utils/load-scripts.ts

@@ -1,3 +1,4 @@
+import { createNetworkError } from '../common';
 import { BundleInfo } from './get-bundle-info';
 
 export function loadScripts({ urls, WebComponent, module }: BundleInfo) {
@@ -5,7 +6,7 @@ export function loadScripts({ urls, WebComponent, module }: BundleInfo) {
         urls.js.map(url => {
             const script = Array.from(document.scripts).find(({ src }) => src === url);
             if (!script) {
-                return new Promise<void>(resolve => {
+                return new Promise<void>((resolve, reject) => {
                     const script = document.createElement('script');
 
                     if (module) {
@@ -18,8 +19,17 @@ export function loadScripts({ urls, WebComponent, module }: BundleInfo) {
                     script.onload = () => {
                         script.dataset.webComponent = WebComponent;
                         script.onload = null;
+                        script.onerror = null;
                         resolve();
                     };
+                    script.onerror = () => {
+                        /*
+                         * Remove the failed script so a later remount can retry
+                         * instead of waiting on it forever.
+                         */
+                        script.remove();
+                        reject(createNetworkError(`Failed to load script: "${url}".`));
+                    };
                     script.src = url;
 
                     document.body.append(script);
@@ -27,13 +37,20 @@ export function loadScripts({ urls, WebComponent, module }: BundleInfo) {
             }
 
             if (!script.dataset.webComponent) {
-                return new Promise<void>(resolve => {
+                return new Promise<void>((resolve, reject) => {
                     const originalOnload = script.onload;
+                    const originalOnerror = script.onerror;
                     script.onload = (...args) => {
                         originalOnload?.call(script, ...args);
                         script.onload = null;
+                        script.onerror = null;
                         resolve();
                     };
+                    script.onerror = (...args) => {
+                        originalOnerror?.call(script, ...args);
+                        script.remove();
+                        reject(createNetworkError(`Failed to load script: "${url}".`));
+                    };
                 });
             }