mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-09 22:14:29 +09:00
Oleg Isonen
d9eb1e2941
https://share.descript.com/view/q8jpNCbmOxP ## Description Originally all remote scripts in html embed were executed async, no matter if they have async attribute or not. Now they respect the order and only execute async if there is async attribute. ## Steps for reproduction This should fail on first load because first script is loaded async and second script depends on it ```html <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.3/gsap.min.js" async=""></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.3/ScrollTrigger.min.js"></script> <script> console.log('gsap', gsap) </script> ``` This should not fail ```html <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.3/gsap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.3/ScrollTrigger.min.js"></script> <script> console.log('gsap', gsap) </script> ``` ## Code Review - [ ] hi @TrySound , I need you to do - conceptual review (architecture, feature-correctness) - detailed review (read every line) - test it on preview ## Before requesting a review - [ ] made a self-review - [ ] added inline comments where things may be not obvious (the "why", not "what") ## Before merging - [ ] tested locally and on preview environment (preview dev login: 5de6) - [ ] updated [test cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md) document - [ ] added tests - [ ] if any new env variables are added, added them to `.env.example` and the `builder/env-check.js` if mandatory
54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
import { createContext, useContext } from "react";
|
|
import type { ImageLoader } from "@webstudio-is/image";
|
|
|
|
export type Params = {
|
|
/**
|
|
* When rendering a published version, there is no renderer defined.
|
|
* - canvas is the builder canvas in dev mode
|
|
* - preview is the preview mode in builder
|
|
*/
|
|
renderer?: "canvas" | "preview";
|
|
/**
|
|
* Base url ir base path for images with ending slash.
|
|
* Used for configuring image with different sizes.
|
|
* Concatinated with "name?width=&quality=&format=".
|
|
*
|
|
* For example
|
|
* /asset/image/ used by default in builder
|
|
* https://image-transform.wstd.io/cdn-cgi/image/
|
|
* https://webstudio.is/cdn-cgi/image/
|
|
*/
|
|
imageBaseUrl: string;
|
|
/**
|
|
* Base url or base path for any asset with ending slash.
|
|
* Used to load assets like fonts or images in styles
|
|
* Concatinated with "name".
|
|
*
|
|
* For example
|
|
* /s/uploads/
|
|
* /asset/file/
|
|
* https://assets-dev.webstudio.is/
|
|
* https://assets.webstudio.is/
|
|
*/
|
|
assetBaseUrl: string;
|
|
};
|
|
|
|
export const ReactSdkContext = createContext<
|
|
Params & {
|
|
imageLoader: ImageLoader;
|
|
// resources need to be any to support accessing unknown fields without extra checks
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
resources: Record<string, any>;
|
|
}
|
|
>({
|
|
assetBaseUrl: "/",
|
|
imageBaseUrl: "/",
|
|
imageLoader: ({ src }) => src,
|
|
resources: {},
|
|
});
|
|
|
|
export const useResource = (name: string) => {
|
|
const { resources } = useContext(ReactSdkContext);
|
|
return resources[name];
|
|
};
|