CODEWITHSUNDEEP
javascriptgoogle-chromecode-snippets
soundyogi
soundyogi

Reputation: 369

chrome-devtools snippets import/export 2016

Today I wanted to export my snippets from chrome.

I found Information from 2013: https://github.com/bgrins/devtools-snippets/issues/28#issuecomment-27455522

I opened the DevTools -> to sperate Window -> Inspect the Devtools Itself

Then in Console:

->localStorage.scriptSnippets
undefined
->var stringifiedSnippets = localStorage.getItem('scriptSnippets');
undefined
->stringifiedSnippets
null

I tested Chrome 48 (windows), Chromium 45(ubuntu) and a Friends Chrome on his Macbook. How can I access my Snippets.

Has the API changed? Or am I making a mistake here. Thanks.

Upvotes: 3

Views: 2166

Answers (4)

Redu
Redu

Reputation: 26191

For those who arrive here and find the accepted answer is no longer working, here is a way to access your snippets as of May 2022 Chrome 101.

  1. Type chrome://version/ on a free tab in your Chrome browser.
  2. Check the "Profile Path:" which should be something like /home/your_user/.config/google-chrome/Default for Ubuntu based OSs.
  3. Find the Preferences file under that path and open it in a text editor. It's a big and messy JSON file. If you are making a new install at a different machine with a fresh Chrome installation then you may just copy this whole Preferences file under the same location in the new machine and i think your Chrome installation should have all the snippets from the original. Otherwise...
  4. Search for (Ctrl+f) "scriptSnippets" property including the quotes.
  5. I believe the snippets are in the order they are created. So not alphabetical like you see them in the snippets list.
  6. My list ends with "scriptSnippets_lastIdentifier":"142" property which means I must have created 142 snippets so far, some removed some remaining.
  7. Copy everything starting from "scriptSnippets":"[... up to ...}]" excluding "scriptSnippets_lastIdentifier":"142" or search for the snippet of your interest by it's name and copy only that portion.

Comment from Apr 2024: In Step 4 search for "script-snippets" instead of "scriptSnippets" and replace "scriptSnippets" with "script-snippets" in the following steps.

Upvotes: 2

Andrew Elans
Andrew Elans

Reputation: 83

Ref. to this post.

As of Apr 2024 scriptSnippets exist under name script-snippets.

Open dev tools in a separate window. In dev tools open dev tools again (Shift + Ctrl + i). Then use console.

To export your snippets:

var export; // array of objects
InspectorFrontendHost.getPreferences(el => export = 
JSON.parse(el['script-snippets']))

Example of export

[
    {
        "name": "Script snippet #1",
        "content": "{\n\n    let i = 10\n   \n    \n ..."
    },
    {
        "name": "Script snippet #2",
        "content": "/*\nconst arr = Array.from({length: 10}, (el, i) => i)\nfor (let i = 0; i < arr.length; ++i) {..."
    }
]

To copy to clipboard

copy(export)

Now you can paste the code into a JSON file and save somewhere as your snippets backup.

To import from your snippets backup file. Open dev tools in a separate window. In dev tools open dev tools again (Shift + Ctrl + i). Then use console.

var import = /* paste JSON here from your saved file */;
InspectorFrontendHost.setPreference("script-snippets", 
JSON.stringify(import));

Upvotes: 0

Alexander Pavlov
Alexander Pavlov

Reputation: 32296

Yes, the internals have changed. Your code should change to the following:

InspectorFrontendHost.getPreferences(function(prefs) {
    console.log(prefs.scriptSnippets);
});

Note: This script shall be run in second depth Dev Tools window! Make sure that the developer tools are undocked into a new window. Then press Ctrl+Shift+i (Command+Option+i) to open DevTools of DevTools. In that second DevTools window, run the script above.

Upvotes: 4

tkowt
tkowt

Reputation: 347

InspectorFrontendHost.getPreferences(function(prefs) {
    console.log(prefs.scriptSnippets);
});
This code works perfectly in chrome version 51.0.2704.103

Upvotes: 0

Related Questions