diff --git a/get-extensions.js b/get-extensions.js index 98f0ced..6648ff7 100644 --- a/get-extensions.js +++ b/get-extensions.js @@ -5,17 +5,48 @@ To get a list of extensions: 2. type in `@enabled` 3. Open VS Code dev toosls `Help` → `Toggle Developer Tools` 4. Paste the code from [get-extensions.js](./get-extensions.js) into the console -5. It will be in your clipboard, so just paste into `vs-code-extensions-i-use.md` +5. You have 10 seconds to scroll your extension list to gather them all. This is weird, but VS code uses virtual scrolling so they are only added to the dom when visible. +5. run copy(markdown), and paste into `vs-code-extensions-i-use.md` */ -function getExtensions() { - const extensions = $$('.extensions-list .monaco-list-row').map(function(row) { +async function getExtensions() { + // VS Code uses Virtual scrolling, so we need to get them all + // I cannot find where in memory, or how to query a list of @enabled + // This is janky AF dont judge me + + // zoom out + vscode.webFrame.setZoomLevel(-10); + const seconds = 5; + console.log(`You have ${seconds} seconds to scroll your list up and down as much as possible!`); + const allExtensions = []; + + const interval = setInterval(function() { + allExtensions.push(...getVisibleExtensions()); + console.log('KEEP SCROLLING!'); + }, 300); + + return new Promise((resolve) => { + setTimeout(() => { + console.log('PHEW DONE!'); + clearInterval(interval); + vscode.webFrame.setZoomLevel(-1); + console.log(allExtensions.length, 'captured'); + const unique = uniqueBy(allExtensions, 'id'); + console.log(unique.length, 'unique'); + resolve(unique) + }, seconds * 1000); + }); + +} + +function getVisibleExtensions() { + const extensions = Array.from(document.querySelectorAll('.extensions-list .monaco-list-row')).map(function (row) { let icon = row.querySelector('.icon').src; const title = row.querySelector('span.name').textContent; const description = row.querySelector('.description').textContent; const id = row.dataset.extensionId; - if(icon.startsWith('vscode-file')) { + if (icon.startsWith('vscode-file')) { icon = `https://cdn.vsassets.io/v/M213_20221206.3/_content/Header/default_icon_128.png`; } @@ -47,6 +78,22 @@ ${rows.join(`\n`)} return markdownTable; } -const extensions = getExtensions(); +function uniqueBy(arr, key) { + let seen = new Set() + + return arr.filter(it => { + let val = it[key] + if (seen.has(val)) { + return false + } else { + seen.add(val) + return true + } + }) +} + + +const extensions = await getExtensions(); +console.info(extensions.length, 'Found!'); const markdown = makeMarkdownTable(extensions); -copy(markdown); \ No newline at end of file +console.info('please run copy(markdown) to get the markdown in your clipboard') \ No newline at end of file diff --git a/vs-code-extensions-i-use.md b/vs-code-extensions-i-use.md index 12d02c9..792e88b 100644 --- a/vs-code-extensions-i-use.md +++ b/vs-code-extensions-i-use.md @@ -1,23 +1,30 @@ Here are a list of all the extensions I use. This is an ever-changing setup! -| ×××××× | | -| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| Auto Rename Tag |

Auto Rename Tag

Auto rename paired HTML/XML tag | -| Better Comments |

Better Comments

Improve your code commenting by annotating with alert, informational, TODOs, and more! | -| Bracket Pair Colorizer 2 |

Bracket Pair Colorizer 2

A customizable extension for colorizing matching brackets | -| Code Spell Checker |

Code Spell Checker

Spelling checker for source code | -| colorize |

colorize

A vscode extension to help visualize css colors in files. | -| Conventional Commits |

Conventional Commits

💬Conventional Commits for VSCode. | -| Debugger for Chrome |

Debugger for Chrome

Debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger protocol. | -| DotENV |

DotENV

Support for dotenv file syntax | -| ESLint |

ESLint

Integrates ESLint JavaScript into VS Code. | -| Git History |

Git History

View git log, file history, compare branches or commits | -| Import Cost |

Import Cost

Display import/require package size in the editor | -| Jest |

Jest

Use Facebook's Jest With Pleasure. | -| Level Up Theme Official |

Level Up Theme Official

➕ Official theme of Level Up Tutorials ➕ | -| Material Icon Theme |

Material Icon Theme

Material Design Icons for Visual Studio Code | -| npm Intellisense |

npm Intellisense

Visual Studio Code plugin that autocompletes npm modules in import statements | -| open in browser |

open in browser

This allows you to open the current file in your default browser or application. | -| Path Intellisense |

Path Intellisense

Visual Studio Code plugin that autocompletes filenames | -| PostCSS Intellisense and Highlighting |

PostCSS Intellisense and Highlighting

Syntax highlighting and intellisense for PostCSS | -| Prettier - Code formatter |

Prettier - Code formatter

Code formatter using prettier | +| ×××××× | | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| Auto Rename Tag |

Auto Rename Tag

Auto rename paired HTML/XML tag | +| Better Comments |

Better Comments

Improve your code commenting by annotating with alert, informational, TODOs, and more! | +| Bracket Pair Colorizer 2 |

Bracket Pair Colorizer 2

A customizable extension for colorizing matching brackets | +| Code Spell Checker |

Code Spell Checker

Spelling checker for source code | +| colorize |

colorize

A vscode extension to help visualize css colors in files. | +| Conventional Commits |

Conventional Commits

💬Conventional Commits for VSCode. | +| Debugger for Chrome |

Debugger for Chrome

Debug your JavaScript code in the Chrome browser, or any other target that supports the Chrome Debugger protocol. | +| DotENV |

DotENV

Support for dotenv file syntax | +| ESLint |

ESLint

Integrates ESLint JavaScript into VS Code. | +| Git History |

Git History

View git log, file history, compare branches or commits | +| Import Cost |

Import Cost

Display import/require package size in the editor | +| Jest |

Jest

Use Facebook's Jest With Pleasure. | +| Level Up Theme Official |

Level Up Theme Official

➕ Official theme of Level Up Tutorials ➕ | +| Material Icon Theme |

Material Icon Theme

Material Design Icons for Visual Studio Code | +| npm Intellisense |

npm Intellisense

Visual Studio Code plugin that autocompletes npm modules in import statements | +| open in browser |

open in browser

This allows you to open the current file in your default browser or application. | +| Path Intellisense |

Path Intellisense

Visual Studio Code plugin that autocompletes filenames | +| PostCSS Intellisense and Highlighting |

PostCSS Intellisense and Highlighting

Syntax highlighting and intellisense for PostCSS | +| Prettier - Code formatter |

Prettier - Code formatter

Code formatter using prettier | +| Svelte 3 Snippets |

Svelte 3 Snippets

Svelte 3 Snippets for VS Code | +| Svelte for VS Code |

Svelte for VS Code

Svelte language support for VS Code | +| SynthWave '84 |

SynthWave '84

A Synthwave-inspired colour theme to satisfy your neon dreams | +| Todo Tree |

Todo Tree

Show TODO, FIXME, etc. comment tags in a tree view | +| vscode-icons |

vscode-icons

Icons for Visual Studio Code | +| vscode-styled-components |

vscode-styled-components

Syntax highlighting for styled-components | +| Wrap Console Log Simple |

Wrap Console Log Simple

Wrap to console.log(or any function name) by word or selection |