Backup Chrome Tabs on Another Device

Tue, Sep 5, 2023 3-minute read

Every time I hear something new, I open up a new Chrome tab on my iPhone and save it for later. I have a lot of tabs open on my phone and I want to back them up to my computer. Occasionally my Chrome will crash, losing all the tabs and there don’t seem to be any ways to get this back, besides going through your synced history and opening each tab again. Not ideal. If that’s happened to you, it could be too late, so back up your tabs now and avoid heartache later. And maybe find a new way to save things for later. I’m trying to move things over to Instapaper, but I’m really looking for a way to save each “journey” into some sort of notebook.

Quick script to extract all the tabs from a Chrome window and save them to a text file. Useful for backing up tabs to another device.

Go to this page on Chrome to see all the tabs you have open on other devices: chrome://history/syncedTabs

It gets super tricky because the tabs are in a shadow DOM. I had to use the Chrome DevTools to find the right elements to extract the information from.

You need to go to the Chrome window you want to extract the tabs from and run the script in the console. The script will extract the title and URL of each tab and save them to a text file. The text file will be downloaded automatically.

I’ve only tested this for one device, so it might not work for multiple devices with tabs open but you can try it out.

I’ve broken them up line by line so you can see what’s going on and if they ever change the DOM structure, you can update the script.

Type these in the console to extract the tabs:

sr1 = document.querySelector("#history-app").shadowRoot
main = sr1.querySelector("#main-container")
sr2 = main.querySelector("#synced-devices").shadowRoot
sr3 = sr2.querySelector("#synced-devices-list").shadowRoot
cards = sr2.querySelector("#synced-device-list")
sr4 = cards.querySelector("history-synced-device-card").shadowRoot
container = sr4.querySelector("#history-item-container")
itemList = container.querySelector("#tab-item-list")
itemContainers = itemList.querySelectorAll(".item-container")

And here’s the script for grabbing it all and saving as a text file:

// Initialize an empty array to hold the extracted information
let extractedData = [];

// Get all the item containers
const itemContainers = document.querySelectorAll(".item-container");

// Loop through each item container to extract information
itemContainers.forEach((item) => {
    // Find the website link element
    const websiteLink = item.querySelector(".website-link");

    // Skip if not found
    if (!websiteLink) return;

    // Extract the title and URL
    const title = websiteLink.getAttribute("title");
    const url = websiteLink.getAttribute("href");

    // Append to the extracted data array as a formatted string
    extractedData.push(`${title}\n${url}`);
});

// Create a Blob object from the extracted data, joined by two newline characters
const blob = new Blob([extractedData.join("\n\n")], { type: "text/plain" });

// Create an anchor element to trigger the download
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = "extracted_tabs.txt";

// Trigger the download
a.click();

// Clean up
URL.revokeObjectURL(a.href);

Keep this in your Dropbox or other cloud storage folder and you’ll always have a backup of your tabs.

Happy backing up!