From dea3fd22d7700452031ea140943182d64114a4c1 Mon Sep 17 00:00:00 2001
From: Austin Farmer <afarmer@usdigitalpartners.com>
Date: Sat, 26 Jan 2019 13:55:08 -0500
Subject: [PATCH] Use the compilation trigger to determine whether CSS
 injection should happen instead of emitted asset names.

---
 lib/BrowserSyncPlugin.js                      | 12 +++++++++---
 lib/getEmittedAssetNamesIfTriggerIsCSSLike.js | 15 +++++++++++++++
 2 files changed, 24 insertions(+), 3 deletions(-)
 create mode 100644 lib/getEmittedAssetNamesIfTriggerIsCSSLike.js

diff --git a/lib/BrowserSyncPlugin.js b/lib/BrowserSyncPlugin.js
index b373c83..9f306e1 100644
--- a/lib/BrowserSyncPlugin.js
+++ b/lib/BrowserSyncPlugin.js
@@ -1,11 +1,13 @@
 const browserSync = require('browser-sync')
 const getCssOnlyEmittedAssetsNames = require('./getCssOnlyEmittedAssetsNames')
+const { wasCompilationAboutCSS, CSSEmittedAssetNames } = require('./getEmittedAssetNamesIfTriggerIsCSSLike');
 
 const defaultPluginOptions = {
   reload: true,
   name: 'bs-webpack-plugin',
   callback: undefined,
-  injectCss: false
+  injectCss: false,
+  injectableTriggerFileTypes: /\.s?a?c?(le)?ss/gm
 }
 
 class BrowserSyncPlugin {
@@ -16,11 +18,15 @@ class BrowserSyncPlugin {
     this.browserSync = browserSync.create(this.options.name)
     this.isWebpackWatching = false
     this.isBrowserSyncRunning = false
+    this.compilationTriggerWasAboutCss = false;
   }
 
   apply (compiler) {
-    const watchRunCallback = () => {
+    const watchRunCallback = (compiler) => {
       this.isWebpackWatching = true
+      if (this.options.reload && this.options.injectCss) {
+        this.compilationTriggerWasAboutCss = wasCompilationAboutCSS(compiler, this.options.injectableTriggerFileTypes)
+      }
     }
     const compilationCallback = () => {
       if (this.isBrowserSyncRunning && this.browserSyncOptions.notify) {
@@ -38,7 +44,7 @@ class BrowserSyncPlugin {
       }
 
       if (this.options.reload) {
-        this.browserSync.reload(this.options.injectCss && getCssOnlyEmittedAssetsNames(stats))
+        this.browserSync.reload((this.options.injectCss && this.compilationTriggerWasAboutCss) && CSSEmittedAssetNames(stats))
       }
     }
 
diff --git a/lib/getEmittedAssetNamesIfTriggerIsCSSLike.js b/lib/getEmittedAssetNamesIfTriggerIsCSSLike.js
new file mode 100644
index 0000000..bf370c4
--- /dev/null
+++ b/lib/getEmittedAssetNamesIfTriggerIsCSSLike.js
@@ -0,0 +1,15 @@
+function wasCompilationAboutCSS(compiler, expressionConfirmingCompilationWasAboutCSS){
+  const { watchFileSystem } = compiler;
+  const watcher = watchFileSystem.watcher || watchFileSystem.wfs.watcher;
+  const files = Object.keys(watcher.mtimes);
+  return files.every(file => expressionConfirmingCompilationWasAboutCSS.test(file));
+}
+
+function CSSEmittedAssetNames(stats) {
+  const assets = stats.compilation.assets;
+  return Object.keys(assets).filter(fileName => {
+    return assets[fileName].emitted && fileName.includes('.css');
+  });
+}
+
+module.exports = { wasCompilationAboutCSS, CSSEmittedAssetNames }