--- a/browser/extensions/onboarding/test/browser/browser.ini
+++ b/browser/extensions/onboarding/test/browser/browser.ini
@@ -1,6 +1,6 @@
 [DEFAULT]
 support-files =
   head.js
 
-[browser_onboarding_hide_tours.js]
 [browser_onboarding_notification.js]
+[browser_onboarding_tours.js]

deleted file mode 100644
--- a/browser/extensions/onboarding/test/browser/browser_onboarding_hide_tours.js
+++ /dev/null
@@ -1,44 +0,0 @@
-/* Any copyright is dedicated to the Public Domain.
- * http://creativecommons.org/publicdomain/zero/1.0/ */
-
-"use strict";
-
-function assertOnboardingDestroyed(browser) {
-  return ContentTask.spawn(browser, {}, function() {
-    let expectedRemovals = [
-      "#onboarding-overlay",
-      "#onboarding-overlay-icon"
-    ];
-    for (let selector of expectedRemovals) {
-      let removal = content.document.querySelector(selector);
-      ok(!removal, `Should remove ${selector} onboarding element`);
-    }
-  });
-}
-
-add_task(async function test_hide_onboarding_tours() {
-  await SpecialPowers.pushPrefEnv({set: [["browser.onboarding.enabled", true]]});
-  await SpecialPowers.pushPrefEnv({set: [["browser.onboarding.hidden", false]]});
-  await SpecialPowers.pushPrefEnv({set: [["browser.onboarding.notification.finished", false]]});
-
-  let newtab = await BrowserTestUtils.openNewForegroundTab(gBrowser, ABOUT_NEWTAB_URL);
-  await promiseOnboardingOverlayLoaded(newtab.linkedBrowser);
-  let hometab = await BrowserTestUtils.openNewForegroundTab(gBrowser, ABOUT_HOME_URL);
-  await promiseOnboardingOverlayLoaded(hometab.linkedBrowser);
-
-  let expectedPrefUpdates = [
-    promisePrefUpdated("browser.onboarding.hidden", true),
-    promisePrefUpdated("browser.onboarding.notification.finished", true)
-  ];
-  await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-overlay-icon", {}, hometab.linkedBrowser);
-  await promiseOnboardingOverlayOpened(hometab.linkedBrowser);
-  await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-tour-hidden-checkbox", {}, hometab.linkedBrowser);
-  await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-overlay-close-btn", {}, hometab.linkedBrowser);
-  await Promise.all(expectedPrefUpdates);
-
-  // Test the hiding operation works arcoss pages
-  await assertOnboardingDestroyed(hometab.linkedBrowser);
-  await BrowserTestUtils.removeTab(hometab);
-  await assertOnboardingDestroyed(newtab.linkedBrowser);
-  await BrowserTestUtils.removeTab(newtab);
-});

new file mode 100644
--- /dev/null
+++ b/browser/extensions/onboarding/test/browser/browser_onboarding_tours.js
@@ -0,0 +1,119 @@
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+ "use strict";
+
+function assertOnboardingDestroyed(browser) {
+  return ContentTask.spawn(browser, {}, function() {
+    let expectedRemovals = [
+      "#onboarding-overlay",
+      "#onboarding-overlay-icon"
+    ];
+    for (let selector of expectedRemovals) {
+      let removal = content.document.querySelector(selector);
+      ok(!removal, `Should remove ${selector} onboarding element`);
+    }
+  });
+}
+
+function assertTourCompletedStyle(tourId, expectComplete, browser) {
+  return ContentTask.spawn(browser, { tourId, expectComplete }, function(args) {
+    let item = content.document.querySelector(`#${args.tourId}.onboarding-tour-item`);
+    if (args.expectComplete) {
+      ok(item.classList.contains("onboarding-complete"), `Should set the complete #${args.tourId} tour with the complete style`);
+    } else {
+      ok(!item.classList.contains("onboarding-complete"), `Should not set the incomplete #${args.tourId} tour with the complete style`);
+    }
+  });
+}
+
+add_task(async function test_hide_onboarding_tours() {
+  resetOnboardingDefaultState();
+  await SpecialPowers.pushPrefEnv({set: [["browser.onboarding.enabled", true]]});
+
+  let tourIds = TOUR_IDs;
+  let tabs = [];
+  for (let url of [ABOUT_NEWTAB_URL, ABOUT_HOME_URL]) {
+    let tab = await BrowserTestUtils.openNewForegroundTab(gBrowser);
+    await BrowserTestUtils.loadURI(tab.linkedBrowser, url);
+    await promiseOnboardingOverlayLoaded(tab.linkedBrowser);
+    await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-overlay-icon", {}, tab.linkedBrowser);
+    await promiseOnboardingOverlayOpened(tab.linkedBrowser);
+    tabs.push(tab);
+  }
+
+  let expectedPrefUpdates = [
+    promisePrefUpdated("browser.onboarding.hidden", true),
+    promisePrefUpdated("browser.onboarding.notification.finished", true)
+  ];
+  tourIds.forEach(id => expectedPrefUpdates.push(promisePrefUpdated(`browser.onboarding.tour.${id}.completed`, true)));
+
+  await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-tour-hidden-checkbox", {}, gBrowser.selectedBrowser);
+  await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-overlay-close-btn", {}, gBrowser.selectedBrowser);
+  await Promise.all(expectedPrefUpdates);
+
+  for (let i = tabs.length - 1; i >= 0; --i) {
+    let tab = tabs[i];
+    await assertOnboardingDestroyed(tab.linkedBrowser);
+    await BrowserTestUtils.removeTab(tab);
+  }
+});
+
+add_task(async function test_click_action_button_to_set_tour_completed() {
+  resetOnboardingDefaultState();
+  await SpecialPowers.pushPrefEnv({set: [["browser.onboarding.enabled", true]]});
+
+  let tourIds = TOUR_IDs;
+  let tabs = [];
+  for (let url of [ABOUT_NEWTAB_URL, ABOUT_HOME_URL]) {
+    let tab = await BrowserTestUtils.openNewForegroundTab(gBrowser);
+    await BrowserTestUtils.loadURI(tab.linkedBrowser, url);
+    await promiseOnboardingOverlayLoaded(tab.linkedBrowser);
+    await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-overlay-icon", {}, tab.linkedBrowser);
+    await promiseOnboardingOverlayOpened(tab.linkedBrowser);
+    tabs.push(tab);
+  }
+
+  let completedTourId = tourIds[0];
+  let expectedPrefUpdate = promisePrefUpdated(`browser.onboarding.tour.${completedTourId}.completed`, true);
+  await BrowserTestUtils.synthesizeMouseAtCenter(`#${completedTourId}-page .onboarding-tour-action-button`, {}, gBrowser.selectedBrowser);
+  await expectedPrefUpdate;
+
+  for (let i = tabs.length - 1; i >= 0; --i) {
+    let tab = tabs[i];
+    for (let id of tourIds) {
+      await assertTourCompletedStyle(id, id == completedTourId, tab.linkedBrowser);
+    }
+    await BrowserTestUtils.removeTab(tab);
+  }
+});
+
+
+add_task(async function test_set_right_tour_completed_style_on_overlay() {
+  resetOnboardingDefaultState();
+  await SpecialPowers.pushPrefEnv({set: [["browser.onboarding.enabled", true]]});
+
+  let tourIds = TOUR_IDs;
+  // Make the tours of even number as completed
+  for (let i = 0; i < tourIds.length; ++i) {
+    setTourCompletedState(tourIds[i], i % 2 == 0);
+  }
+
+  let tabs = [];
+  for (let url of [ABOUT_NEWTAB_URL, ABOUT_HOME_URL]) {
+    let tab = await BrowserTestUtils.openNewForegroundTab(gBrowser);
+    await BrowserTestUtils.loadURI(tab.linkedBrowser, url);
+    await promiseOnboardingOverlayLoaded(tab.linkedBrowser);
+    await BrowserTestUtils.synthesizeMouseAtCenter("#onboarding-overlay-icon", {}, tab.linkedBrowser);
+    await promiseOnboardingOverlayOpened(tab.linkedBrowser);
+    tabs.push(tab);
+  }
+
+  for (let i = tabs.length - 1; i >= 0; --i) {
+    let tab = tabs[i];
+    for (let j = 0; j < tourIds.length; ++j) {
+      await assertTourCompletedStyle(tourIds[j], j % 2 == 0, tab.linkedBrowser);
+    }
+    await BrowserTestUtils.removeTab(tab);
+  }
+});