From 4293ddb6a712813365a9d8fc67dbe79113bf1e53 Mon Sep 17 00:00:00 2001
From: Stuart Colville <scolville@mozilla.com>
Date: Fri, 8 Jul 2016 14:37:04 +0100
Subject: [PATCH] Prospectively dispatch UNINSTALLING state earlier

---
 src/disco/components/Addon.js              |  1 +
 src/disco/css/InstallButton.scss           | 10 ++++++----
 tests/client/disco/components/TestAddon.js | 14 ++++++++++++++
 3 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/disco/components/Addon.js b/src/disco/components/Addon.js
index 44cad892c7e..f5b29d4e287 100644
--- a/src/disco/components/Addon.js
+++ b/src/disco/components/Addon.js
@@ -393,6 +393,7 @@ export function mapDispatchToProps(dispatch, { _tracking = tracking,
         [EXTENSION_TYPE]: 'addon',
         [THEME_TYPE]: 'theme',
       }[type] || 'invalid';
+      dispatch({ type: INSTALL_STATE, payload: { guid, status: UNINSTALLING } });
       return _addonManager.uninstall(guid)
         .then(() => {
           _tracking.sendEvent({
diff --git a/src/disco/css/InstallButton.scss b/src/disco/css/InstallButton.scss
index db6d70781e5..0c7f70aa97c 100644
--- a/src/disco/css/InstallButton.scss
+++ b/src/disco/css/InstallButton.scss
@@ -35,7 +35,7 @@ $installStripeColor2: #00c42e;
   }
 }
 
-@mixin stripes($color1, $color2) {
+@mixin stripes($color1, $color2, $stripeBackgroundColor) {
   animation: stripes 0.5s linear infinite;
   background-image:
     repeating-linear-gradient(
@@ -47,7 +47,7 @@ $installStripeColor2: #00c42e;
       $color1 50%
     );
   background-size: $size/2 $size/2;
-  background-color: $switchBackgroundOn;
+  background-color: $stripeBackgroundColor;
 }
 
 .switch {
@@ -113,7 +113,8 @@ $installStripeColor2: #00c42e;
     input + label::before {
       @include stripes(
         $uninstallStripeColor1,
-        $uninstallStripeColor2);
+        $uninstallStripeColor2,
+        $switchBackgroundOff);
       // Reverse the stripe direction without
       // impacting the animation speed.
       transform: scaleX(-1);
@@ -163,7 +164,8 @@ $installStripeColor2: #00c42e;
       &::before {
         @include stripes(
           $installStripeColor1,
-          $installStripeColor2);
+          $installStripeColor2,
+          $switchBackgroundOn);
       }
       &::after {
         transform: translateX($switchHandleActivePosition);
diff --git a/tests/client/disco/components/TestAddon.js b/tests/client/disco/components/TestAddon.js
index 8ef7ee386fe..40312b68b0f 100644
--- a/tests/client/disco/components/TestAddon.js
+++ b/tests/client/disco/components/TestAddon.js
@@ -735,6 +735,13 @@ describe('<Addon />', () => {
       const { uninstall } = mapDispatchToProps(dispatch, { _addonManager: fakeAddonManager });
       return uninstall({ guid, installURL })
         .then(() => {
+          assert(dispatch.calledWith({
+            type: INSTALL_STATE,
+            payload: {
+              guid,
+              status: UNINSTALLING,
+            },
+          }));
           assert(fakeAddonManager.uninstall.calledWith(guid));
         });
     });
@@ -746,6 +753,13 @@ describe('<Addon />', () => {
       const { uninstall } = mapDispatchToProps(dispatch, { _addonManager: fakeAddonManager });
       return uninstall({ guid, installURL })
         .then(() => {
+          assert(dispatch.calledWith({
+            type: INSTALL_STATE,
+            payload: {
+              guid,
+              status: UNINSTALLING,
+            },
+          }));
           assert(dispatch.calledWith({
             type: INSTALL_STATE,
             payload: { guid, status: ERROR, error: FATAL_UNINSTALL_ERROR },