Codepen. They call a new project a "pen". Make a
new pen. This has panes for HTML, CSS and JavaScript. https://codepen.io/your-work
Google Colab. This supports Javascript by putting
%%javascript or %%js at the top of a cell. I believe this requires you
to login via a free Google account. https://colab.research.google.com/
JS.do. Has HTML pane, where you must put JS, but no
other panes. Has login option. Code pane does not wrap to pane size. https://js.do/
JSBin. Cick on a button to change panes for HTML,
CSS, Javascript, the console, or output. Has login feature to save your
tests. https://jsbin.com
JSFiddle. Share examples, collaborate with other
users. It has an option to login to keep your test cases. https://jsfiddle.net/
Web Toolkit JavaScript Tester. No sign in needed.
This has various convertors like hex, CSV to XML, encoders like Base64
or URL, formatters for CSS, JSON, SQL, XML, HTML, etc. It also has a
regular expression tester. https://www.webtoolkitonline.com/javascript-tester.html
1.2 Test JS with local install
Jest. It works with projects using: Babel,
TypeScript, Node, React, Angular, Vue and more! https://jestjs.io/
OneCompiler. There is no pane for HTML or CSS, just
for JS. They support about 50+ languages here including Basic, C, C++,
C#, Python. https://onecompiler.com/javascript
Playcode JS Compiler. "Run JavaScript online with
TypeScript, JSX, and npm support. Compile JS code instantly in your
browser. Free, no signup required." Start from scracth or use one of
their templates or use AI to describe what you want. Create a website or
code. https://playcode.io/javascript-compiler
1.4 Tools
Playcode. ($) Build apps and sites with AI. There
is a sign in option. They have more compilers online like Go, SQL. This
site has a popup where you choose the language to support but it doesn't
go away making it impossible to use the site for Javascript. https://playcode.io
This will print the interpreter type, like "Node" and the
version.
//This is a comment, but not supported for all JS clients.
console.log("Running JS: " + navigator.userAgent)
1.6.2 Hiding text
Browsers may vary in which method they support.
<div style="display:none;"></div> takes up no
space in the document.
//Use the 'hidden' attribute in HTML.
<P>This is a paragraph.</p>
<p hidden>This is hidden.</p>
<div hidden>
This div is hidden.
</div>
<p>This is below the hidden div.</p>