Enhances the Svelte REPL: https://svelte.dev/repl/ with:
- Autosave on Tab switch and after 1 minute inactive
- Scrollbar position save between Tab switches
- Global search in selected (green) Tabs, output to F12 Console
- Sourcecode History per Tab
Install the Browser Extension from the Chrome Web Store
-
Clone this repo to a local directory
- On Windows: disable the creation of the Thumbs.db file:
select the Advanced Attributes properties of the created folder
UNselect the Allow Index files
- On Windows: disable the creation of the Thumbs.db file:
-
Open chrome://extensions in the Chrome Browser
-
Switch to Developer Mode (top right)
-
Click the [Load Unpacked] button
-
Select directory from step 1
-
The REPL extension will now activate on any https://svelte.dev/repl page
The Svelte REPL Meister uses advanced Console functionalities not available the Console Svelte outputs to.
Open the F12 Console by clicking inside the Svelte result window, selecting Inspect
(or select the about:srcdoc
console in your open F12 console)
- open edge://extensions
- turn on Allow extensions from other stores
- install the Svelte REPL Meister extension from the Chrome Web Store
The Svelte save button is clicked on every Tab switch and after 60 seconds of inactivity
The Svelte REPL replaces the whole CodeMirror editor on every Tab switch, this (ofcourse) resets the Tab position to the top.
The Svelte REPL Meister records the Scroll Position on every Editor change,
and restores the Scroll Position after a Tab switch
The Svelte REPL Meister stores all editor contents on Tab switch.
The searchbox searches all these (green/seen) Tabs and outputs the results to the F12 Console
Double click a word in the source code to search (in green/seen tabs)
'Unload' green/seen tabs by reloading the whole REPL
You can store/restore the editor contents per Tab
Bold green indicates the History content is the same as the current editor
Reloading the page will destroy all history!!!
But you hardly every have to reload/F5 the Svelte REPL