request permissions

emberjs · Apr 29, 2024 · 9f96de0 · 9f96de0
1 parent 0557cb8
commit 9f96de0
Show file tree

Hide file tree

Showing 7 changed files with 89 additions and 2 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -20,6 +20,7 @@ module.exports = {
     browser: true,
   },
   globals: {
+    chrome: false,
     basicContext: false,
     require: false,
     requireModule: false,

diff --git a/app/controllers/application.js b/app/controllers/application.js
@@ -32,6 +32,7 @@ export default class ApplicationController extends Controller {
   @tracked _navWidthExpanded = 180;
   @tracked _navWidthCollapsed = 48;
   @tracked navIsCollapsed = false;
+  @tracked inspectingTabOrigin = null;
 
   get navWidth() {
     return this.navIsCollapsed
@@ -53,6 +54,25 @@ export default class ApplicationController extends Controller {
     this.mixinDetails = [];
   }
 
+  get targetTabOrigin() {
+    if (!this.inspectingTabOrigin) {
+      void this.requestTargetTabOrigin();
+      return null;
+    }
+    return `${window.location.origin}/request.html?tabOrigin=${this.inspectingTabOrigin}`;
+  }
+
+  requestTargetTabOrigin() {
+    // during tests
+    if (typeof chrome === 'undefined') {
+      return;
+    }
+    chrome.devtools.inspectedWindow.eval('window.location', (resp) => {
+      const origin = resp.origin;
+      this.inspectingTabOrigin = origin;
+    });
+  }
+
   /*
    * Called when digging deeper into object stack
    * from within the ObjectInspector
@@ -190,4 +210,25 @@ export default class ApplicationController extends Controller {
       this.set('mixinDetails', null);
     }
   }
+
+  @action
+  requestPermissionForAll() {
+    function onResponse(response) {
+      if (response) {
+        console.log('Permission was granted');
+      } else {
+        console.log('Permission was refused');
+      }
+      return chrome.permissions.getAll();
+    }
+
+    const permissionsToRequest = {
+      origins: ['<all_urls>'],
+    };
+
+    chrome.permissions.request(permissionsToRequest).then(async (response) => {
+      const currentPermissions = await onResponse(response);
+      console.log(`Current permissions:`, currentPermissions);
+    });
+  }
 }
diff --git a/app/services/adapters/chrome.js b/app/services/adapters/chrome.js
@@ -6,7 +6,6 @@ export default class Chrome extends WebExtension {
   @tracked canOpenResource = true;
 
   openResource(file, line) {
-    /*global chrome */
     // For some reason it opens the line after the one specified
     chrome.devtools.panels.openResource(file, line - 1);
   }

diff --git a/app/services/adapters/web-extension.js b/app/services/adapters/web-extension.js
@@ -1,4 +1,3 @@
-/* globals chrome */
 import { computed } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 

diff --git a/app/templates/application.hbs b/app/templates/application.hbs
@@ -83,6 +83,9 @@
       <ul>
         <li>This is not an Ember application.</li>
         <li>You are using an old version of Ember (&lt; rc5).</li>
+        <li>You did not have set up the addons permissions.
+          <a target='_blank' rel="noopener noreferrer" href={{this.targetTabOrigin}}>request permissions</a>
+        </li>
         {{#if this.isChrome}}
           <li>
             You are using the file:// protocol (instead of http://), in which case:

diff --git a/skeletons/web-extension/request.html b/skeletons/web-extension/request.html
@@ -0,0 +1,31 @@
+<html>
+<head>
+  <link rel="stylesheet" href="./panes-3-16-0/assets/ember-inspector.css">
+  <link rel="stylesheet" href="./panes-3-16-0/assets/vendor.css">
+</head>
+<body class='theme--light'>
+<div class="error-page box-border overflow-auto absolute inset-0 flex text-base13 text-md bg-base02">
+  <div class="error-page__content box-border relative m-auto px-6 pb-6 rounded bg-base00"  style='border: 1px solid orangered'>
+    <div class="error-page__header overflow-hidden relative flex items-center font-bold text-4xl">
+      <div class="flex-grow pt-6">
+        <br />
+        Request permission to enable ember inspector
+        <img style='position: absolute; right: 0; top: 0' src='./panes-3-16-0/assets/images/icon48.png'/>
+        <br />
+        <br />
+      </div>
+    </div>
+
+    <div class="error-page__body pb-2">
+      <button style='padding: 5px' id='request-all'>request permission for all sites</button>
+      <br />
+      <br />
+      <button style='padding: 5px' id='request-one'>request permission for </button>
+      <br />
+      <br />
+    </div>
+  </div>
+</div>
+</body>
+<script src='./request.js'></script>
+</html>
diff --git a/skeletons/web-extension/request.js b/skeletons/web-extension/request.js
@@ -0,0 +1,13 @@
+document.getElementById('request-all').addEventListener('click', async () =>  {
+  await chrome.permissions.request({origins: ['<all_urls>']});
+  window.close()
+})
+
+const url = new URL(window.location);
+const tabOrigin = url.searchParams.get('tabOrigin');
+document.getElementById('request-one').innerText += ' ' + tabOrigin;
+
+document.getElementById('request-one').addEventListener('click', async () =>  {
+  await chrome.permissions.request({origins: [tabOrigin + '/*']});
+  window.close()
+})