--- a/browser/base/content/test/plugins/browser.ini
+++ b/browser/base/content/test/plugins/browser.ini
@@ -21,16 +21,17 @@ support-files =
   plugin_bug797677.html
   plugin_bug820497.html
   plugin_clickToPlayAllow.html
   plugin_clickToPlayDeny.html
   plugin_favorfallback.html
   plugin_hidden_to_visible.html
   plugin_iframe.html
   plugin_outsideScrollArea.html
+  plugin_overlay_styles.html
   plugin_overlayed.html
   plugin_positioned.html
   plugin_simple_blank.swf
   plugin_shouldShowOverlay.html
   plugin_small.html
   plugin_small_2.html
   plugin_syncRemoved.html
   plugin_test.html
@@ -66,16 +67,17 @@ tags = blocklist
 [browser_CTP_iframe.js]
 tags = blocklist
 [browser_CTP_nonplugins.js]
 tags = blocklist
 [browser_CTP_notificationBar.js]
 tags = blocklist
 [browser_CTP_outsideScrollArea.js]
 tags = blocklist
+[browser_CTP_overlay_styles.js]
 [browser_CTP_remove_navigate.js]
 tags = blocklist
 [browser_CTP_resize.js]
 tags = blocklist
 [browser_CTP_shouldShowOverlay.js]
 [browser_CTP_zoom.js]
 tags = blocklist
 [browser_blocking.js]

--- a/browser/base/content/test/plugins/browser_CTP_notificationBar.js
+++ b/browser/base/content/test/plugins/browser_CTP_notificationBar.js
@@ -77,18 +77,18 @@ add_task(async function() {
 
   let pluginInfo = await promiseForPluginInfo("test");
   ok(!pluginInfo.activated, "Test 1a, plugin should not be activated");
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(!overlay || !overlay.classList.contains("visible"),
-      "Test 3b, overlay should be hidden.");
+    Assert.ok(!overlay || overlay.getAttribute("sizing") == "blank",
+      "Test 3b, overlay should be blank.");
   });
 });
 
 add_task(async function() {
   await promiseTabLoadEvent(gBrowser.selectedTab, gTestRoot + "plugin_positioned.html");
 
   // Work around for delayed PluginBindingAttached
   await promiseUpdatePluginBindings(gTestBrowser);
@@ -104,18 +104,18 @@ add_task(async function() {
     Assert.equal(plugin.pluginFallbackType, Ci.nsIObjectLoadingContent.PLUGIN_CLICK_TO_PLAY,
       "Test 4b, plugin fallback type should be PLUGIN_CLICK_TO_PLAY");
   });
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(!overlay || !overlay.classList.contains("visible"),
-      "Test 4b, overlay should be hidden.");
+    Assert.ok(!overlay || overlay.getAttribute("sizing") == "blank",
+      "Test 4b, overlay should be blank.");
   });
 });
 
 // Test that the notification bar is getting dismissed when directly activating plugins
 // via the doorhanger.
 
 add_task(async function() {
   await promiseTabLoadEvent(gBrowser.selectedTab, gTestRoot + "plugin_small.html");

--- a/browser/base/content/test/plugins/browser_CTP_outsideScrollArea.js
+++ b/browser/base/content/test/plugins/browser_CTP_outsideScrollArea.js
@@ -53,17 +53,17 @@ add_task(async function() {
 
   await promisePopupNotification("click-to-play-plugins");
 
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     let plugin = content.document.getElementById("test");
     let doc = content.document;
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
     Assert.ok(overlay && overlay.classList.contains("visible") &&
-              !overlay.classList.contains("minimal"),
+              overlay.getAttribute("sizing") != "blank",
               "Test 2, overlay should be visible.");
   });
 });
 
 add_task(async function() {
   await promiseTabLoadEvent(gBrowser.selectedTab, gTestRoot + "plugin_outsideScrollArea.html");
 
   await ContentTask.spawn(gTestBrowser, {}, async function() {
@@ -83,17 +83,17 @@ add_task(async function() {
 
   await promisePopupNotification("click-to-play-plugins");
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let plugin = content.document.getElementById("test");
     let doc = content.document;
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
     Assert.ok(overlay && overlay.classList.contains("visible") &&
-              !overlay.classList.contains("minimal"),
+              overlay.getAttribute("sizing") != "blank",
               "Test 3, overlay should be visible.");
   });
 });
 
 add_task(async function() {
   await promiseTabLoadEvent(gBrowser.selectedTab, gTestRoot + "plugin_outsideScrollArea.html");
 
   await ContentTask.spawn(gTestBrowser, {}, async function() {
@@ -111,12 +111,12 @@ add_task(async function() {
   // Work around for delayed PluginBindingAttached
   await promiseUpdatePluginBindings(gTestBrowser);
 
   await promisePopupNotification("click-to-play-plugins");
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let plugin = content.document.getElementById("test");
     let doc = content.document;
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(!overlay || !overlay.classList.contains("visible"),
-      "Test 4, overlay should be hidden.");
+    Assert.ok(!overlay || overlay.getAttribute("sizing") == "blank",
+      "Test 4, overlay should be blank.");
   });
 });

new file mode 100644
--- /dev/null
+++ b/browser/base/content/test/plugins/browser_CTP_overlay_styles.js
@@ -0,0 +1,93 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+/* This test ensures that the click-to-play "Activate Plugin" overlay
+ * is shown in the right style (which is dependent on its size).
+ */
+
+const rootDir = getRootDirectory(gTestPath);
+const gTestRoot = rootDir.replace("chrome://mochitests/content/", "http://127.0.0.1:8888/");
+
+var gTestBrowser = null;
+
+const gTestcases = {
+
+  // 10x10
+  testcase1: {
+    sizing: "blank",
+    notext: null,
+  },
+
+  // 40x40
+  testcase2: {
+    sizing: "tiny",
+    notext: "notext",
+  },
+
+  // 100x70
+  testcase3: {
+    sizing: "reduced",
+    notext: "notext",
+  },
+
+  // 200x200
+  testcase4: {
+    sizing: null,
+    notext: "notext",
+  },
+
+  // 300x300
+  testcase5: {
+    sizing: null,
+    notext: null,
+  },
+}
+
+
+add_task(async function() {
+  registerCleanupFunction(function() {
+    clearAllPluginPermissions();
+    setTestPluginEnabledState(Ci.nsIPluginTag.STATE_ENABLED, "Test Plug-in");
+    gBrowser.removeCurrentTab();
+    gTestBrowser = null;
+  });
+});
+
+add_task(async function() {
+  gBrowser.selectedTab = BrowserTestUtils.addTab(gBrowser);
+  gTestBrowser = gBrowser.selectedBrowser;
+
+  setTestPluginEnabledState(Ci.nsIPluginTag.STATE_CLICKTOPLAY, "Test Plug-in");
+
+  let popupNotification = PopupNotifications.getNotification("click-to-play-plugins", gTestBrowser);
+  ok(!popupNotification, "Sanity check, should not have a click-to-play notification");
+
+  await promiseTabLoadEvent(gBrowser.selectedTab, gTestRoot + "plugin_overlay_styles.html");
+
+  // Work around for delayed PluginBindingAttached
+  await promiseUpdatePluginBindings(gTestBrowser);
+
+  await ContentTask.spawn(gTestBrowser, gTestcases, async function(testcases) {
+    let doc = content.document;
+
+    for (let testcaseId of Object.keys(testcases)) {
+      let plugin = doc.querySelector(`#${testcaseId} > object`);
+      let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
+      Assert.ok(overlay, `overlay exists in ${testcaseId}`);
+
+      let expectations = testcases[testcaseId];
+
+      Assert.ok(overlay.classList.contains("visible") == true,
+                `The expected visibility is correct in ${testcaseId}`);
+
+      Assert.ok(overlay.getAttribute("sizing") == expectations.sizing,
+                `The expected sizing is correct in ${testcaseId}`);
+
+      Assert.ok(overlay.getAttribute("notext") == expectations.notext,
+                `The expected notext is correct in ${testcaseId}`);
+    }
+  });
+});

--- a/browser/base/content/test/plugins/browser_CTP_resize.js
+++ b/browser/base/content/test/plugins/browser_CTP_resize.js
@@ -41,36 +41,36 @@ add_task(async function() {
 add_task(async function() {
   let popupNotification = PopupNotifications.getNotification("click-to-play-plugins", gTestBrowser);
   ok(popupNotification, "Test 2, Should have a click-to-play notification");
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(!overlay || overlay.classList.contains("minimal"),
-      "Test 2, overlay should be hidden.");
+    Assert.ok(!overlay || overlay.getAttribute("sizing") == "blank",
+      "Test 2, overlay should be blank.");
   });
 });
 
 add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     let plugin = content.document.getElementById("test");
     plugin.style.width = "300px";
   });
 
   // Work around for delayed PluginBindingAttached
   await promiseUpdatePluginBindings(gTestBrowser);
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(!overlay || overlay.classList.contains("minimal"),
-      "Test 3, overlay should be hidden.");
+    Assert.ok(!overlay || overlay.getAttribute("sizing") == "blank",
+      "Test 3, overlay should be blank.");
   });
 });
 
 
 add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     let plugin = content.document.getElementById("test");
     plugin.style.height = "300px";
@@ -79,17 +79,17 @@ add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     content.document.getElementById("test").clientTop;
   });
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(overlay && overlay.classList.contains("visible"),
+    Assert.ok(overlay && overlay.getAttribute("sizing") != "blank",
       "Test 4, overlay should be visible.");
   });
 });
 
 add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     let plugin = content.document.getElementById("test");
     plugin.style.width = "10px";
@@ -99,18 +99,18 @@ add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     content.document.getElementById("test").clientTop;
   });
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(!overlay || overlay.classList.contains("minimal"),
-      "Test 5, overlay should be hidden.");
+    Assert.ok(!overlay || overlay.getAttribute("sizing") == "blank",
+      "Test 5, overlay should be blank.");
   });
 });
 
 add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     let plugin = content.document.getElementById("test");
     plugin.style.height = "300px";
     plugin.style.width = "300px";
@@ -119,12 +119,12 @@ add_task(async function() {
   await ContentTask.spawn(gTestBrowser, {}, async function() {
     content.document.getElementById("test").clientTop;
   });
 
   await ContentTask.spawn(gTestBrowser, null, async function() {
     let doc = content.document;
     let plugin = doc.getElementById("test");
     let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
-    Assert.ok(overlay && overlay.classList.contains("visible"),
+    Assert.ok(overlay && overlay.getAttribute("sizing") != "blank",
       "Test 6, overlay should be visible.");
   });
 });

--- a/browser/base/content/test/plugins/browser_CTP_shouldShowOverlay.js
+++ b/browser/base/content/test/plugins/browser_CTP_shouldShowOverlay.js
@@ -2,16 +2,22 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
 /* This test ensures that the click-to-play "Activate Plugin" overlay
  * is shown when expected.
  * All testcases are in the plugin_shouldShowOverlay.html file.
+ *
+ * Note: Technically, the overlay is *always* shown. When this test was
+ * originally written, the meaning of "shown" was "shown with the contents",
+ * as opposed to "shown as blank". The behavior hasn't changed, but the naming
+ * has: now, a "shown as blank" overlay no longer receives a ".hidden" class.
+ * It receives a sizing="blank" attribute.
  */
 
 var rootDir = getRootDirectory(gTestPath);
 const gTestRoot = rootDir.replace("chrome://mochitests/content/", "http://127.0.0.1:8888/");
 
 var gTestBrowser = null;
 
 add_task(async function() {
@@ -44,13 +50,13 @@ add_task(async function() {
     for (let testcase of testcases) {
       let plugin = testcase.querySelector("object");
       Assert.ok(plugin, `plugin exists in ${testcase.id}`);
 
       let overlay = doc.getAnonymousElementByAttribute(plugin, "anonid", "main");
       Assert.ok(overlay, `overlay exists in ${testcase.id}`);
 
       let expectedVisibility = (testcase.getAttribute("shouldshow") == "true");
-      Assert.ok(overlay.classList.contains("visible") == expectedVisibility,
+      Assert.ok((overlay.getAttribute("sizing") != "blank") == expectedVisibility,
                 `The expected visibility is correct in ${testcase.id}`);
     }
   })
 });

new file mode 100644
--- /dev/null
+++ b/browser/base/content/test/plugins/plugin_overlay_styles.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+</head>
+<body>
+
+  <div id="testcase1" class="testcase">
+    <object width="10" height="10" type="application/x-test"></object>
+  </div>
+
+  <div id="testcase2" class="testcase">
+    <object width="40" height="40" type="application/x-test"></object>
+  </div>
+
+  <div id="testcase3" class="testcase">
+    <object width="100" height="70" type="application/x-test"></object>
+  </div>
+
+  <div id="testcase4" class="testcase">
+    <object width="200" height="200" type="application/x-test"></object>
+  </div>
+
+  <div id="testcase5" class="testcase">
+    <object width="300" height="300" type="application/x-test"></object>
+  </div>
+
+</body>
+</html>