Add a button to copy links to the current window's tabs

popup.html

@@ -6,6 +6,7 @@
 
     <button id="copy-current-tab-button">Copy Current Tab</button>
     <button id="copy-selected-tabs-button">Copy Selected Tab</button>
+    <button id="copy-all-tabs-button">Copy All Tabs</button>
 
     <script src="popup.js" type="module"></script>
   </body>

popup.js

@@ -5,6 +5,7 @@ import { createLinkForTab, createLinksForTabs } from './src/link.js';
 let messageBox = document.getElementById('message-box');
 let copyCurrentTabButton = document.getElementById('copy-current-tab-button');
 let copySelectedTabsButton = document.getElementById('copy-selected-tabs-button');
+let copyAllTabsButton = document.getElementById('copy-all-tabs-button')
 
 function appendMessage(messageText) {
   let messageElement = document.createElement('p')
@@ -34,4 +35,15 @@ copySelectedTabsButton.addEventListener('click', () => {
       })
     })
     .catch((err) => console.error(err))
-})
+})
+
+copyAllTabsButton.addEventListener('click', () => {
+  findTabs({currentWindow: true})
+    .then(tabs => {
+      let linkText = createLinksForTabs(tabs)
+
+      writeTextToClipboard(linkText).then(() => {
+        appendMessage('Copied All Tabs!')
+      })
+    })
+})

test/popup.test.js

@@ -1,32 +1,33 @@
-import { screen, waitFor } from '@testing-library/dom'
+import { screen } from '@testing-library/dom'
 import userEvent from '@testing-library/user-event'
 
 describe("appendMessage", () => {
+  let mockChrome = {}
+
   beforeAll(() => {
     document.body.innerHTML = `
       <div id="message-box"></div>
 
       <button id="copy-current-tab-button">Copy Current Tab</button>
       <button id="copy-selected-tabs-button">Copy Selected Tabs</button>
+      <button id="copy-all-tabs-button">Copy All Tabs</button>
     `;
 
+    jest.mock("../src/chrome.js", () => mockChrome)
+
     require("./../popup.js");
   })
 
   describe('When click copy current tab button', () => {
     let user
 
-    jest.mock("../src/chrome.js", () => {
-      return {
-        findTabs: jest.fn(() => {
-          return Promise.resolve([
-            { title: "hoge", url: "https://www.example.com" },
-          ]);
-        }),
-      };
-    });
-
     beforeEach(async () => {
+      mockChrome.findTabs = jest.fn(() => {
+        return Promise.resolve([
+          { title: "hoge", url: "https://www.example.com" },
+        ]);
+      }),
+
       user = userEvent.setup()
       const button = screen.getByRole('button', { name: 'Copy Current Tab' })
       await user.click(button);
@@ -48,18 +49,13 @@ describe("appendMessage", () => {
   describe("When clicking copy selected tab button", () => {
     let user
 
-    jest.mock("../src/chrome.js", () => {
-      return {
-        findTabs: jest.fn(() => {
+    beforeEach(async () => {
+      mockChrome.findTabs = jest.fn(() => {
           return Promise.resolve([
             { title: "hoge", url: "https://www.example.com" },
             { title: "fuga", url: "https://fuga.example.com" },
           ]);
-        }),
-      };
-    });
-
-    beforeEach(async () => {
+        })
       user = userEvent.setup()
       const button = screen.getByRole('button', { name: 'Copy Selected Tabs' })
       await user.click(button)
@@ -77,4 +73,32 @@ describe("appendMessage", () => {
       expect(clipboardText).toEqual(expectedText)
     })
   })
+
+  describe("When clicking copy all tabs button", () => {
+    let user
+
+    beforeEach(async () => {
+      mockChrome.findTabs = jest.fn(() => {
+          return Promise.resolve([
+            { title: "foo", url: "https://www.foo.com" },
+            { title: "bar", url: "https://www.bar.com" },
+          ]);
+        })
+      user = userEvent.setup()
+      const button = screen.getByRole('button', { name: 'Copy All Tabs' })
+      await user.click(button)
+    })
+
+    test("show message", async () => {
+      const message = await screen.getByText('Copied All Tabs!')
+      expect(message).toBeTruthy()
+    })
+
+    test("writes a list of the links to the clipboard", async () => {
+      const clipboardText = await window.navigator.clipboard.readText()
+      const expectedText = " [https://www.foo.com foo]\n [https://www.bar.com bar]"
+
+      expect(clipboardText).toEqual(expectedText)
+    })
+  })
 });