honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add a random query param to force reload of script src on smart navigation

This commit is contained in:
Mikael Svenson 2019-03-18 08:56:39 +01:00
parent 71b03b4db2
commit 8c975dac6b
3 changed files with 8 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
samples/react-script-editor/README.md
View File

@ -39,12 +39,6 @@ The web part works by loading each script in a `<script src>` tag sequentially i
![site page header configurator web part](./assets/modern-script-editor-wp.gif) ![site page header configurator web part](./assets/modern-script-editor-wp.gif)
If you for some reason need the script to force load on each new page, add the attribute `reload` to the script tag.
This will reload the script even on smart modern page loads.
```html
<script src="myscript.js" reload></script>
```
If all you want is to add markup on the page, you can do that as well. Adding the following html would show a headline and a list. If all you want is to add markup on the page, you can do that as well. Adding the following html would show a headline and a list.
```html ```html

2
samples/react-script-editor/config/package-solution.json
View File

@ -3,7 +3,7 @@
"solution": { "solution": {
"name": "Modern Script Editor web part by Puzzlepart", "name": "Modern Script Editor web part by Puzzlepart",
"id": "1425175f-3ed8-44d2-8fc4-dd1497191294", "id": "1425175f-3ed8-44d2-8fc4-dd1497191294",
"version": "1.0.0.10", "version": "1.0.0.11",
"includeClientSideAssets": true, "includeClientSideAssets": true,
"skipFeatureDeployment": false "skipFeatureDeployment": false
}, },

17
samples/react-script-editor/src/webparts/scriptEditor/ScriptEditorWebPart.ts
View File

@ -13,6 +13,7 @@ import { IScriptEditorWebPartProps } from './IScriptEditorWebPartProps';
import PropertyPaneLogo from './PropertyPaneLogo'; import PropertyPaneLogo from './PropertyPaneLogo';
export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEditorWebPartProps> { export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEditorWebPartProps> {
public save: (script: string) => void = (script: string) => { public save: (script: string) => void = (script: string) => {
this.properties.script = script; this.properties.script = script;
this.render(); this.render();
@ -149,14 +150,10 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
const urls = []; const urls = [];
const onLoads = []; const onLoads = [];
const forceReload = [];
for (let i = 0; scripts[i]; i++) { for (let i = 0; scripts[i]; i++) {
const scriptTag = scripts[i]; const scriptTag = scripts[i];
if (scriptTag.src && scriptTag.src.length > 0) { if (scriptTag.src && scriptTag.src.length > 0) {
urls.push(scriptTag.src); urls.push(scriptTag.src);
if (scriptTag.attributes["reload"]) {
forceReload.push(scriptTag.src);
}
} }
if (scriptTag.onload && scriptTag.onload.length > 0) { if (scriptTag.onload && scriptTag.onload.length > 0) {
onLoads.push(scriptTag.onload); onLoads.push(scriptTag.onload);
@ -172,14 +169,12 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
for (let i = 0; i < urls.length; i++) { for (let i = 0; i < urls.length; i++) {
try { try {
const scriptUrl = urls[i]; let scriptUrl = urls[i];
try { if (this.renderedOnce) {
if (forceReload.indexOf(scriptUrl) !== -1) { let prefix = scriptUrl.indexOf('?') === -1 ? '?' : '&';
let hackReload = (<any>SPComponentLoader)._instance; scriptUrl += prefix + 'cow=' + new Date().getTime();
hackReload._systemJsLoader.delete(urls[i]);
} }
} catch (silent) { } await SPComponentLoader.loadScript(scriptUrl, { globalExportsName: "ScriptGlobal" });
await SPComponentLoader.loadScript(urls[i], { globalExportsName: "ScriptGlobal" });
} catch (error) { } catch (error) {
if (console.error) { if (console.error) {
console.error(error); console.error(error);