improve async, inline dev source-maps for browser sources

src/content/features/click-modal-close.js

@@ -1,6 +1,6 @@
 import select from 'select-dom'
 
-export default parent => {
+export default async parent => {
   const closeButton = select('button[ng-click="cancel()"]', parent)
 
   if (closeButton) {

src/content/features/click-modal-inactive-check.js

@@ -1,6 +1,6 @@
 import select from 'select-dom'
 
-export default parent => {
+export default async parent => {
   const resumeButton = select('button[ng-click="refresh()"]', parent)
 
   if (resumeButton) {

src/content/features/click-modal-match-queuing-continue.js

@@ -1,6 +1,6 @@
 import select from 'select-dom'
 
-export default parent => {
+export default async parent => {
   const continueButton = select(
     'button[ng-click="close()"][translate-once="CONTINUE"]',
     parent

src/content/features/click-modal-match-ready.js

@@ -1,7 +1,7 @@
 import select from 'select-dom'
 import { notifyIf } from '../helpers/user-settings'
 
-export default parent => {
+export default async parent => {
   // Quickmatch
   let acceptButton = select(
     'button[ng-click="close()"][translate-once="ACCEPT"]:not([disabled]',

src/content/features/click-modal-match-room-captain-ok.js

@@ -1,6 +1,6 @@
 import select from 'select-dom'
 
-export default parent => {
+export default async parent => {
   const okButton = select(
     'button[ng-click="close()"][translate-once="OK"]',
     parent

src/content/features/click-modal-party-invite-accept.js

@@ -1,7 +1,7 @@
 import select from 'select-dom'
 import { notifyIf } from '../helpers/user-settings'
 
-export default parent => {
+export default async parent => {
   const acceptButton = select(
     'button[ng-click="acceptInvite()"][translate-once="ACCEPT"]:not([disabled])',
     parent

src/content/index.js

@@ -61,9 +61,12 @@ function observeBody() {
   }
 
   const observer = new MutationObserver(mutationList => {
-    const modalElement = select('.modal-dialog')
+    ;(async () => {
+      const modalElement = select('.modal-dialog')
+      if (!modalElement) {
+        return
+      }
 
-    if (modalElement) {
       if (modals.isInviteToParty(modalElement)) {
         runFeatureIf(
           'partyAutoAcceptInvite',
@@ -108,7 +111,7 @@ function observeBody() {
           debouncedPlayerProfileStatsFeatures(modalElement)
         }
       }
-    }
+    })()
 
     runFeatureIf('headerShowElo', addHeaderLevelProgress)
     runFeatureIf(
@@ -117,10 +120,11 @@ function observeBody() {
     )
 
     addSidebarMatchesElo()
-
-    const mainContentElement = select('#main-content')
-
-    if (mainContentElement) {
+    ;(async () => {
+      const mainContentElement = select('#main-content')
+      if (!mainContentElement) {
+        return
+      }
       if (pages.isRoomOverview() && matchRoomIsReady()) {
         addMatchRoomPlayerBadges(mainContentElement)
         addMatchRoomPlayerColors(mainContentElement)
@@ -181,18 +185,18 @@ function observeBody() {
           mainContentElement
         )
       }
-    }
-
-    for (const mutation of mutationList) {
-      for (const addedNode of mutation.addedNodes) {
-        if (addedNode.shadowRoot) {
+    })()
+    ;(async () => {
+      mutationList
+        .flatMap(mutation => mutation.addedNodes)
+        .filter(node => node.shadowRoot)
+        .forEach(addedNode => {
           observer.observe(addedNode.shadowRoot, {
             childList: true,
             subtree: true
           })
-        }
-      }
-    }
+        })
+    })()
   })
 
   observer.observe(document.body, { childList: true, subtree: true })

webpack.config.js

@@ -5,7 +5,7 @@ const CleanWebpackPlugin = require('clean-webpack-plugin')
 const CopyWebpackPlugin = require('copy-webpack-plugin')
 
 module.exports = {
-  devtool: process.env.NODE_ENV === 'production' ? false : 'sourcemap',
+  devtool: process.env.NODE_ENV === 'production' ? false : 'inline-source-map',
   context: path.resolve(__dirname, 'src'),
   entry: {
     content: './content/index.js',