V3 migration

src/js/background.js

@@ -1,7 +1,7 @@
 /* Received returnSearchInfo message, set badge text with number of results */
 chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
   if ('returnSearchInfo' == request.message) {
-    chrome.browserAction.setBadgeText({
+    chrome.action.setBadgeText({
       'text': String(request.numResults),
       'tabId': sender.tab.id
     });

src/js/content.js

@@ -189,25 +189,23 @@ function search(regexString, configurationChanged) {
       'selectedColor' : DEFAULT_SELECTED_COLOR,
       'textColor' : DEFAULT_TEXT_COLOR,
       'maxResults' : DEFAULT_MAX_RESULTS,
-      'caseInsensitive' : DEFAULT_CASE_INSENSITIVE}, 
-      function(result) {
-        initSearchInfo(regexString);
-        if(result.caseInsensitive){
-          regex = new RegExp(regexString, 'i');
-        }
-        highlight(regex, result.highlightColor, result.selectedColor, result.textColor, result.maxResults);
-        selectFirstNode(result.selectedColor);
-        returnSearchInfo('search');
+      'caseInsensitive' : DEFAULT_CASE_INSENSITIVE
+    }).then((result) => {
+      initSearchInfo(regexString);
+      if(result.caseInsensitive){
+        regex = new RegExp(regexString, 'i');
       }
-    );
+      highlight(regex, result.highlightColor, result.selectedColor, result.textColor, result.maxResults);
+      selectFirstNode(result.selectedColor);
+      returnSearchInfo('search');
+    });
   } else if (regex && regexString != '' && regexString === searchInfo.regexString) { // elements are already highlighted
     chrome.storage.local.get({
       'highlightColor' : DEFAULT_HIGHLIGHT_COLOR,
-      'selectedColor' : DEFAULT_SELECTED_COLOR}, 
-      function(result) {
-        selectNextNode(result.highlightColor, result.selectedColor);
-      }
-    );
+      'selectedColor' : DEFAULT_SELECTED_COLOR
+    }).then((result) => {
+      selectNextNode(result.highlightColor, result.selectedColor);
+    });
   } else { // blank string or invalid regex
     removeHighlight();
     initSearchInfo(regexString);
@@ -227,22 +225,18 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
     chrome.storage.local.get({
       'highlightColor' : DEFAULT_HIGHLIGHT_COLOR,
       'selectedColor' : DEFAULT_SELECTED_COLOR
-      }, 
-      function(result) {
-        selectNextNode(result.highlightColor, result.selectedColor);
-      }
-    );
+    }).then((result) => {
+      selectNextNode(result.highlightColor, result.selectedColor);
+    });
   }
   /* Received selectPrevNode message, select previous regex match */
   else if ('selectPrevNode' == request.message) {
     chrome.storage.local.get({
       'highlightColor' : DEFAULT_HIGHLIGHT_COLOR,
       'selectedColor' : DEFAULT_SELECTED_COLOR
-      }, 
-      function(result) {
-        selectPrevNode(result.highlightColor, result.selectedColor);
-      }
-    );
+    }).then((result) => {
+      selectPrevNode(result.highlightColor, result.selectedColor);
+    });
   }
   else if ('copyToClipboard' == request.message) {
     var clipboardHelper = document.createElement('textarea');

src/js/options.js

@@ -58,7 +58,7 @@ function saveOptions() {
       'maxHistoryLength' : document.getElementById('maxHistoryLength').value
     }
 
-    chrome.storage.local.set(options, function() {
+    chrome.storage.local.set(options).then(() => {
       markStatus('New settings saved');
     });
   }
@@ -72,25 +72,24 @@ function loadOptions() {
     'textColor' : DEFAULT_TEXT_COLOR,
     'maxResults' : DEFAULT_MAX_RESULTS,
     'instantResults' : DEFAULT_INSTANT_RESULTS,
-    'maxHistoryLength' : DEFAULT_MAX_HISTORY_LENGTH }, 
-    function(result) {
-      document.getElementById('highlightColor').value = result.highlightColor;
-      document.getElementById('exampleHighlighted').style.backgroundColor = result.highlightColor;
-      document.getElementById('selectedColor').value = result.selectedColor;
-      document.getElementById('exampleSelected').style.backgroundColor = result.selectedColor;
-      document.getElementById('textColor').value = result.textColor;
-      document.getElementById('exampleHighlighted').style.color = result.textColor;
-      document.getElementById('exampleSelected').style.color = result.textColor;
-      document.getElementById('maxResults').value = result.maxResults;
-      document.getElementById('instantResults').checked = result.instantResults;
-      document.getElementById('maxHistoryLength').value = result.maxHistoryLength;
-    }
-  );
+    'maxHistoryLength' : DEFAULT_MAX_HISTORY_LENGTH
+  }).then((result) => {
+    document.getElementById('highlightColor').value = result.highlightColor;
+    document.getElementById('exampleHighlighted').style.backgroundColor = result.highlightColor;
+    document.getElementById('selectedColor').value = result.selectedColor;
+    document.getElementById('exampleSelected').style.backgroundColor = result.selectedColor;
+    document.getElementById('textColor').value = result.textColor;
+    document.getElementById('exampleHighlighted').style.color = result.textColor;
+    document.getElementById('exampleSelected').style.color = result.textColor;
+    document.getElementById('maxResults').value = result.maxResults;
+    document.getElementById('instantResults').checked = result.instantResults;
+    document.getElementById('maxHistoryLength').value = result.maxHistoryLength;
+  });
 }
 
 /* Restore default configuration */
 function restoreDefaults() {
-  chrome.storage.local.clear(function() {
+  chrome.storage.local.clear().then(() => {
     markStatus('Defaults restored');
   });
   loadOptions();

src/js/popup.js

@@ -36,8 +36,7 @@ function selectNext(){
   chrome.tabs.query({
     'active': true,
     'currentWindow': true
-  },
-  function(tabs) {
+  }).then((tabs) => {
     if ('undefined' != typeof tabs[0].id && tabs[0].id) {
       chrome.tabs.sendMessage(tabs[0].id, {
         'message' : 'selectNextNode'
@@ -51,8 +50,7 @@ function selectPrev(){
   chrome.tabs.query({
     'active': true,
     'currentWindow': true
-  },
-  function(tabs) {
+  }).then((tabs) => {
     if ('undefined' != typeof tabs[0].id && tabs[0].id) {
       chrome.tabs.sendMessage(tabs[0].id, {
         'message' : 'selectPrevNode'
@@ -74,21 +72,20 @@ function passInputToContentScript(configurationChanged){
     } else {
       document.getElementById('inputRegex').style.backgroundColor = WHITE_COLOR;
     }
-    chrome.tabs.query(
-      { 'active': true, 'currentWindow': true },
-      function(tabs) {
-        if ('undefined' != typeof tabs[0].id && tabs[0].id) {
-          processingKey = true;
-          chrome.tabs.sendMessage(tabs[0].id, {
-            'message' : 'search',
-            'regexString' : regexString,
-            'configurationChanged' : configurationChanged,
-            'getNext' : true
-          });
-          sentInput = true;
-        }
+    chrome.tabs.query({ 
+      'active': true, 'currentWindow': true 
+    }).then((tabs) => {
+      if ('undefined' != typeof tabs[0].id && tabs[0].id) {
+        processingKey = true;
+        chrome.tabs.sendMessage(tabs[0].id, {
+          'message' : 'search',
+          'regexString' : regexString,
+          'configurationChanged' : configurationChanged,
+          'getNext' : true
+        });
+        sentInput = true;
       }
-    );
+    });
   }
 }
 
@@ -174,17 +171,18 @@ function setHistoryVisibility(makeVisible) {
 }
 
 function setCaseInsensitiveElement() {
-  var caseInsensitive = chrome.storage.local.get({'caseInsensitive':DEFAULT_CASE_INSENSITIVE},
-  function (result) {
+  chrome.storage.local.get({
+    'caseInsensitive':DEFAULT_CASE_INSENSITIVE
+  }).then((result) => {
     document.getElementById('insensitive').title = result.caseInsensitive ? DISABLE_CASE_INSENSITIVE_TITLE : ENABLE_CASE_INSENSITIVE_TITLE;
     if(result.caseInsensitive) {
       document.getElementById('insensitive').className = 'selected';
     } else {
       document.getElementById('insensitive').className = '';
     }
   });
-
 }
+
 function toggleCaseInsensitive() {
   var caseInsensitive = document.getElementById('insensitive').className == 'selected';
   document.getElementById('insensitive').title = caseInsensitive ? ENABLE_CASE_INSENSITIVE_TITLE : DISABLE_CASE_INSENSITIVE_TITLE;
@@ -235,8 +233,7 @@ document.getElementById('copy-to-clipboard').addEventListener('click', function
   chrome.tabs.query({
       'active': true,
       'currentWindow': true
-    },
-    function (tabs) {
+    }).then((tabs) => {
       if ('undefined' != typeof tabs[0].id && tabs[0].id) {
         chrome.tabs.sendMessage(tabs[0].id, {
           'message': 'copyToClipboard'
@@ -271,15 +268,15 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  * http://stackoverflow.com/questions/5203407/javascript-multiple-keys-pressed-at-once */
 var map = [];
 onkeydown = onkeyup = function(e) {
-    map[e.keyCode] = e.type == 'keydown';
+    map[e.key] = e.type == 'keydown';
     if (document.getElementById('inputRegex') === document.activeElement) { //input element is in focus
-      if (!map[16] && map[13]) { //ENTER
+      if (!map['Shift'] && map['Enter']) { //ENTER
         if (sentInput) {
           selectNext();
         } else {
           passInputToContentScript();
         }
-      } else if (map[16] && map[13]) { //SHIFT + ENTER
+      } else if (map['Shift'] && map['Enter']) { //SHIFT + ENTER
         selectPrev();
       }
     }
@@ -292,8 +289,8 @@ chrome.storage.local.get({
     'instantResults' : DEFAULT_INSTANT_RESULTS,
     'maxHistoryLength' : MAX_HISTORY_LENGTH,
     'searchHistory' : null,
-    'isSearchHistoryVisible' : false},
-  function(result) {
+    'isSearchHistoryVisible' : false
+  }).then((result) => {
     if(result.instantResults) {
       document.getElementById('inputRegex').addEventListener('input', function() {
         passInputToContentScript();
@@ -314,19 +311,17 @@ chrome.storage.local.get({
     }
     setHistoryVisibility(result.isSearchHistoryVisible);
     updateHistoryDiv();
-  }
-);
+  });
 
 /* Get search info if there is any */
 chrome.tabs.query({
   'active': true,
   'currentWindow': true
-},
-function(tabs) {
+}).then((tabs) => {
   if ('undefined' != typeof tabs[0].id && tabs[0].id) {
     chrome.tabs.sendMessage(tabs[0].id, {
       'message' : 'getSearchInfo'
-    }, function(response){
+    }).then((response) => {
       if (response) {
         // Content script is active
         console.log(response);

src/manifest.json

@@ -1,5 +1,5 @@
 {
-  "manifest_version": 2,
+  "manifest_version": 3,
 
   "name": "Chrome Regex Search",
   "description": "An extension for Regex Search in lieu of Chrome's CTRL+F",
@@ -15,7 +15,7 @@
     "128": "icons/icons_128.png",
     "256": "icons/icons_256.png"
   },
-  "browser_action": {
+  "action": {
     "default_icon": {
       "16": "icons/icons_16.png",
       "24": "icons/icons_24.png",
@@ -34,8 +34,7 @@
     "storage"
   ],
   "background": {
-    "scripts": ["js/background.js"],
-    "persistent": true
+    "service_worker": "js/background.js"
   },
   "content_scripts": [
     {
@@ -44,7 +43,7 @@
     }
   ],
   "commands": {
-    "_execute_browser_action": {
+    "_execute_action": {
       "suggested_key": {
         "windows": "Ctrl+Shift+F",
         "mac": "Command+Shift+F",