This is a basic quick made vanilla js (no dependencies required) plugin to edit shader at runtime, it’s purpose is to be small/simple but comfortable to make quick changes, test with direct visible changes instead reloading a entire app or game if it doesn’t use a IDE or just to test something.
Specifically to be used through dev tools inspection passing a material in the global variable so the editor will initialize if it wasn’t yet and pop up.
sk.edit( mesh.material )
The plugin only needs to be included, it’s lazy and only creates UI and anything when being called, by default it uses plain text editing which is enough for quick tests/prototyping, fixes or changes, by enabling the full mode it will load Codemirror which is more comfortable for creating a bit more complex shader in your direct environment instead externally.
Will extend it a bit further to also allow in-built materials that will be patched with onBeforeCompile, an a better undo/redo history support regarding tab indentions.
Plain text mode, single tab supported and ctrl+s shortcut to update.
Demo
Thanks!