refactor: fix issues in review

- refactor API connector
- unquote object keys

background/openusercss-api.js

@@ -1,13 +1,17 @@
 'use strict';
 
+(() => {
   // begin:nanographql - Tiny graphQL client library
+  // Author: yoshuawuyts (https://github.com/yoshuawuyts)
   // License: MIT
+  // Modified by DecentM to fit project standards
 
   const getOpname = /(query|mutation) ?([\w\d-_]+)? ?\(.*?\)? \{/;
   const gql = str => {
     str = Array.isArray(str) ? str.join('') : str;
     const name = getOpname.exec(str);
-  return function (variables) {
+
+    return variables => {
       const data = {query: str};
       if (variables) data.variables = JSON.stringify(variables);
       if (name && name.length) {
@@ -21,29 +25,20 @@ const gql = str => {
   // end:nanographql
 
   const api = 'https://api.openusercss.org';
-const doQuery = ({id}, queryString) => new Promise((resolve, reject) => {
+  const doQuery = ({id}, queryString) => {
     const query = gql(queryString);
 
-  fetch(api, {
-    'method': 'POST',
-    'headers': new Headers({
+    return fetch(api, {
+      method: 'POST',
+      headers: new Headers({
         'Content-Type': 'application/json'
       }),
-    'body': query({
+      body: query({
         id
       })
     })
-  .then(res => {
-    res.json()
-    .then(response => {
-      if (response.errors) {
-        reject(new Error(JSON.stringify(response.errors)));
-      }
-      resolve(response);
-    });
-  })
-  .catch(reject);
-});
+    .then(res => res.json());
+  };
 
   window.API_METHODS = Object.assign(window.API_METHODS || {}, {
     /**
@@ -60,7 +55,7 @@ window.API_METHODS = Object.assign(window.API_METHODS || {}, {
      *   @returns {Promise.<{data: object}>} The GraphQL result with the `theme` object
      */
 
-  'oucThemeById': params => doQuery(params, `
+    oucThemeById: params => doQuery(params, `
       query($id: ID!) {
         theme(id: $id) {
           _id
@@ -92,7 +87,7 @@ window.API_METHODS = Object.assign(window.API_METHODS || {}, {
      *   @returns {Promise.<{data: object}>} The GraphQL result with the `user` object
      */
 
-  'oucUserById': params => doQuery(params, `
+    oucUserById: params => doQuery(params, `
       query($id: ID!) {
         user(id: $id) {
           _id
@@ -104,3 +99,4 @@ window.API_METHODS = Object.assign(window.API_METHODS || {}, {
       }
     `),
   });
+})();

content/install-hook-openusercss.js

@@ -1,5 +1,6 @@
 'use strict';
 
+(() => {
   const manifest = chrome.runtime.getManifest();
   const allowedOrigins = [
     'https://openusercss.org',
@@ -10,7 +11,7 @@ const askHandshake = () => {
     // Tell the page that we exist and that it should send the handshake
     allowedOrigins.forEach(origin => {
       window.postMessage({
-      'type': 'ouc-begin-handshake'
+        type: 'ouc-begin-handshake'
       }, origin);
     });
   };
@@ -18,10 +19,12 @@ const askHandshake = () => {
   // Listen for queries by the site and respond with a callback object
   const sendInstalledCallback = styleData => {
     allowedOrigins.forEach(origin => {
+      if (origin === location.origin) {
         window.postMessage({
-      'type':  'ouc-is-installed-response',
-      'style': styleData
+          type: 'ouc-is-installed-response',
+          style: styleData
         }, origin);
+      }
     });
   };
 
@@ -33,24 +36,19 @@ const attachInstalledListeners = () => {
         && allowedOrigins.includes(event.origin)
       ) {
         chrome.runtime.sendMessage({
-        'method':    'findUsercss',
-        'name':      event.data.name,
-        'namespace': event.data.namespace
+          method: 'findUsercss',
+          name: event.data.name,
+          namespace: event.data.namespace
         }, style => {
-        if (style) {
-          sendInstalledCallback({
-            'installed': true,
-            'enabled':   style.enabled,
-            'name':      event.data.name,
-            'namespace': event.data.namespace
-          });
-        } else {
-          sendInstalledCallback({
-            'installed': false,
-            'name':      event.data.name,
-            'namespace': event.data.namespace
-          });
-        }
+          const data = {event};
+          const callbackObject = {
+            installed: Boolean(style),
+            enabled: style.enabled,
+            name: data.name,
+            namespace: data.namespace
+          };
+
+          sendInstalledCallback(callbackObject);
         });
       }
     });
@@ -94,11 +92,11 @@ const doHandshake = () => {
     // additional metadata
     allowedOrigins.forEach(origin => {
       window.postMessage({
-      'type':      'ouc-handshake-response',
-      'key':       event.data.key,
-      'extension': {
-        'name':         manifest.name,
-        'capabilities': reportedFeatures
+        type: 'ouc-handshake-response',
+        key: event.data.key,
+        extension: {
+          name: manifest.name,
+          capabilities: reportedFeatures
         }
       }, origin);
     });
@@ -122,8 +120,8 @@ const sendInstallCallback = data => {
     // we were able to install the theme and it may display a success message
     allowedOrigins.forEach(origin => {
       window.postMessage({
-      'type': 'ouc-install-callback',
-      'key':  data.key
+        type: 'ouc-install-callback',
+        key: data.key
       }, origin);
     });
   };
@@ -137,14 +135,14 @@ const attachInstallListeners = () => {
         && allowedOrigins.includes(event.origin)
       ) {
         chrome.runtime.sendMessage({
-        'method':     'saveUsercss',
-        'reason':     'install',
-        'name':       event.data.title,
-        'sourceCode': event.data.code,
+          method: 'saveUsercss',
+          reason: 'install',
+          name: event.data.title,
+          sourceCode: event.data.code,
         }, response => {
           sendInstallCallback({
-          'enabled': response.enabled,
-          'key':     event.data.key
+            enabled: response.enabled,
+            key: event.data.key
           });
         });
       }
@@ -157,3 +155,4 @@ const attachInstallListeners = () => {
     attachInstalledListeners();
     askHandshake();
   })();
+})();