From f7299edfdb6cd767df2b2403d23e85cab477ebc8 Mon Sep 17 00:00:00 2001 From: LFades Date: Mon, 25 Apr 2022 11:07:52 -0500 Subject: [PATCH 1/3] Updated paragraph --- docs/basic-features/script.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/basic-features/script.md b/docs/basic-features/script.md index e673936661fe..62e83b4d46e4 100644 --- a/docs/basic-features/script.md +++ b/docs/basic-features/script.md @@ -250,7 +250,7 @@ There are two limitations to be aware of when using the Script component for inl ### Executing Code After Loading (`onLoad`) -Some third-party scripts require users to run JavaScript code after the script has finished loading in order to instantiate content or call a function. If you are loading a script with either `beforeInteractive` or `afterInteractive` as a loading strategy, you can execute code after it has loaded using the `onLoad` property: +Some third-party scripts require users to run JavaScript code after the script has finished loading in order to instantiate content or call a function. If you are loading a script with either `afterInteractive` or `lazyOnload` as a loading strategy, you can execute code after it has loaded using the `onLoad` property: ```jsx import { useState } from 'react' From 495af238820730eccc22216eec714925e04536b1 Mon Sep 17 00:00:00 2001 From: LFades Date: Mon, 25 Apr 2022 12:14:16 -0500 Subject: [PATCH 2/3] Updated note --- docs/basic-features/script.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/basic-features/script.md b/docs/basic-features/script.md index 62e83b4d46e4..ac6999a654dd 100644 --- a/docs/basic-features/script.md +++ b/docs/basic-features/script.md @@ -250,6 +250,8 @@ There are two limitations to be aware of when using the Script component for inl ### Executing Code After Loading (`onLoad`) +> **Note: Both `onLoad` and `onError` can't be used with the `beforeInteractive` loading strategy.** + Some third-party scripts require users to run JavaScript code after the script has finished loading in order to instantiate content or call a function. If you are loading a script with either `afterInteractive` or `lazyOnload` as a loading strategy, you can execute code after it has loaded using the `onLoad` property: ```jsx @@ -273,8 +275,6 @@ export default function Home() { } ``` -> **Note: `onLoad` can't be used with the `beforeInteractive` loading strategy.** - Sometimes it is helpful to catch when a script fails to load. These errors can be handled with the `onError` property: ```jsx From 36fa91e1b1c3a2f873f7558aab0ee2d7752198b1 Mon Sep 17 00:00:00 2001 From: LFades Date: Mon, 25 Apr 2022 12:14:36 -0500 Subject: [PATCH 3/3] Added docs for `onError` in API reference --- docs/api-reference/next/script.md | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/docs/api-reference/next/script.md b/docs/api-reference/next/script.md index 7ef25eca3c3e..c1470361fcc1 100644 --- a/docs/api-reference/next/script.md +++ b/docs/api-reference/next/script.md @@ -73,3 +73,29 @@ export default function Home() { ) } ``` + +### onError + +A method that executes if the script fails to load. + +> **Note: `onError` can't be used with the `beforeInteractive` loading strategy.** + +The following is an example of how to use the `onError` property: + +```jsx +import Script from 'next/script' + +export default function Home() { + return ( + <> +