Allow adding attributes to import of scripts and styles

[muuvmuuv]

🐛 Bug Report

I get an error when loading scripts from a CDN because there is no hash set to the CDN Url. This could be fixed by giving more options to the scripts-array in the config:

Additionally this would add support for async and deferattributes

const config = {
  scripts: [
    {
      src: "https://cdnjs.cloudflare.com/ajax/libs/featherlight/1.7.13/featherlight.min.js",
      integrity: "sha256-/SEQTcl9tvyYDA8SuhV/PMn92shN3kNn8C9vnbBcE9Y=",
      crossorigin: "anonymous",
      async: true
    },
    "../js/theme.js",
  ]
};

Have you read the Contributing Guidelines on issues?

yes

To Reproduce

1. new Docusaurus
2. add CDN script
3. run locally
4. see the console

Expected behaviour

no error in the console

(Write what you thought would happen.)

Actual Behavior

Error in the console:

Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src https:". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.

(Write what happened. Add screenshots, if applicable.)

Reproducible Demo

https://hastebin.com/elawucenon.js

[helloworld]

@muuvmuuv I can't reproduce the issue using your example scripts (they all load as expected), but this is still a good feature to have.

@endiliey can I claim this? I think a simple check of if source is an Object, and simply spreading the object key/values as attributes would be sufficient, unless you would prefer whitelisting only the valid script tag attributes.

this.props.config.scripts.map(source => {
  if (source instanceof Object) {
    return <script type="text/javascript" key={source.src} {...source} />;
  }

  return <script type="text/javascript" key={source} src={source} />;
});

[yangshun]

@helloworld it's yours!

I've added an "issue-claimed" label so that others will know not to start work on the issue. If you change your mind about the issue, no worries! Just let me know so that I can remove the label and free it up for someone else to claim.

I'll check in with you periodically so that we can keep the task updated with the progress.

[muuvmuuv]

@helloworld maybe it is just a problem of my local running environment. But yes would anyway a good feature. I‘m looking forward to see this in the next updates

_{Sent with GitHawk}

[endiliey]

@helloworld still working on this ?

[endiliey]

@wszgxa sure 👍. Send a PR in

[yangshun]

@wszgxa it's yours!

I've added an "issue: claimed" label so that others will know not to start work on the issue. If you change your mind about the issue, no worries! Just let me know so that I can remove the label and free it up for someone else to claim.

I'll check in with you periodically so that we can keep the task updated with the progress.

[ravennasoftware]

@endiliey This appears to be available again. Can I snag it? Should have some time this weekend.

[endiliey]

@ravennasoftware, sure.

Send a PR in. Best asap so we can release 1.5 along with it

[endiliey]

My bad. #937 should have closed this