Move inline scripts to public folder, document CSP setup

index.js

@@ -1,13 +1,7 @@
-const fs = require('fs');
-const path = require('path');
 const replace = require('broccoli-string-replace');
 
 function injectScript(scriptName) {
-  let dirname = __dirname || process.cwd();
-  let filePath = path.join(dirname, 'lib', 'resources', scriptName);
-  let fileContent = fs.readFileSync(filePath, { encoding: 'utf8' });
-
-  return `<script>\n${fileContent}</script>`;
+  return `<script src="/ember-electron/${scriptName}"></script>`;
 }
 
 module.exports = {

package.json

@@ -88,6 +88,7 @@
     "ember-cli-sass": "^10.0.1",
     "ember-cli-sri": "^2.1.1",
     "ember-cli-uglify": "^3.0.0",
+    "ember-data": "^3.24.0",
     "ember-disable-prototype-extensions": "^1.1.3",
     "ember-export-application-global": "^2.0.1",
     "ember-load-initializers": "^2.1.1",

tests/dummy/app/router.js

@@ -17,6 +17,7 @@ Router.map(function() {
     this.route('guides', function() {
       this.route('ci');
       this.route('common-issues');
+      this.route('csp');
       this.route('development-and-debugging');
       this.route('installation');
       this.route('security');

tests/dummy/app/templates/docs.hbs

@@ -9,6 +9,7 @@
     {{nav.item "Upgrading" "docs.guides.upgrading"}}
     {{nav.item "Development and Debugging" "docs.guides.development-and-debugging"}}
     {{nav.item "CI" "docs.guides.ci"}}
+    {{nav.item "Content Security Policy (CSP)" "docs.guides.csp"}}
 
     {{nav.section "FAQ"}}
     {{nav.item "Common Issues" "docs.faq.common-issues"}}

tests/dummy/app/templates/docs/guides/csp.md

@@ -0,0 +1,42 @@
+# Using a Content Security Policy
+
+You may have noticed Electron warns if you do not have a Content Security Policy setup.
+This has been the case for quite awhile. To fix it, you may want to setup a CSP that
+makes sense for your app.
+
+First, you will need to install [ember-cli-content-security-policy](https://github.com/rwjblue/ember-cli-content-security-policy).
+
+```bash
+ember install ember-cli-content-security-policy
+```
+
+Then you should start by adding this default config to your `config/environment.js` file
+and tweak it further for the needs of your app.
+
+```js
+contentSecurityPolicy: {
+  'default-src': ["'none'"],
+  'script-src': [
+    'http://localhost:7020',
+    'http://localhost:7357',
+    'http://testemserver',
+    "'self'",
+    "'unsafe-inline'"
+  ],
+  'font-src': ["'self'"],
+  'frame-src': ['http://localhost:7357', 'http://testemserver/', "'self'"],
+  'connect-src': ["'self'"],
+  'img-src': ['data:', "'self'"],
+  'style-src': ["'self'", "'unsafe-inline'"],
+  'media-src': ["'self'"]
+},
+contentSecurityPolicyMeta: true,
+```
+
+If you are using ember-auto-import or embroider you will also need to forbid eval there:
+
+```js
+autoImport: {
+  forbidEval: true
+},
+```