Issue #484  (valueAsNumber/Date, JS Libs, Testing, Uncats)10/27/22

There are a couple of odd JavaScript properties available on input elements in HTML forms that I just found out about. I'm guessing these would have been much more useful prior to the different features we now have in HTML5 forms.

The properties are valueAsDate and valueAsNumber. Each of these can be used to read or attempt to write the value of an input field. Here's some basic code that assumes my input fields have ID values of "date" and "number" respectively:

You can try a full demo on CodePen here.

You'll notice that the number input element is of type "number", so that means you can't enter anything in that field that's not a number value. Despite this, when you check the what type the value is using the typeof operator, it returns "string". Not very useful.

But when using the valueAsNumber property, the value is correctly identified as a number. This might be handy to easily validate and convert the value behind the scenes. Of course, with HTML5 validation, this probably isn't as useful as it used to be. But it's nice to know it's there for some edge cases.

The demo also includes the valueAsDate property, but I didn't find this one was particularly useful. Because the form field uses the "date" type, I can safely know it's a proper date object. But if I use a regular text field, then try to enter a 'date-like' value, it doesn't seem to recognize it.

There are some details on both properties in the DOM spec, so you can check that out if you'd like to know how the browser is expected to behave when using these properties.

Now on to this week's tools!
 

JavaScript Libraries and Frameworks

Get Early Access to TelemetryHub!
TelemetryHub is an observability tool that collects all your complex telemetry data into a single pane of glass view by leveraging the power of OpenTelemetry. Get optimal transparency into your distributed system without per-seat pricing!    SPONSORED 

Hyper Fetch
Framework for data exchange, asynchronous state management, complex persistence and queueing, for any JavaScript or TypeScript environment like React, Angular, Svelte, Vue, and others.

Precessing
A general-purpose 2D graphics library that's beginner-friendly, cross-platform and available for JavaScript as well as C, C++, and Java.

Capsid
Declarative DOM programming library based on TypeScript decorators that's small, has no dependencies, and uses standard HTML and TypeScript syntax.

TS-Pattern
An exhaustive pattern matching library for TypeScript with smart type inference. Pattern matching lets you express complex conditions in a single, compact expression so your code is shorter and more readable.

Meriyah
A 100% compliant and self-hosted JavaScript parser with a high focus on performance and stability.

json2html
An open source library that uses JavaScript templates to render JSON objects into HTML so you can build fast, interactive client side templates using nothing but JavaScript.

Hono
A small, simple, and ultrafast web framework for Cloudflare Workers, Deno, Bun, and others.

Flimsy
Love the name. A single-file less-than-1kb minified/gzip'd simplified implementation of the reactive core of the popular Solid JavaScript library, optimized for clean code.

Radash
A functional lodash-like utility library that's modern, simple, typed, and powerful.

Bao.js
A fast, minimalist web framework for the Bun JavaScript runtime that's 3.7x faster than Express.js and has similar syntax for an easy transition.

Blueboat
An all-in-one, multi-tenant serverless JavaScript runtime that combines Google's V8 JavaScript engine, process-level snapshots, and Rust, for speed.

On the Release Radar:

• tRPC – End-to-end type-safe APIs now at version 10+
• melonJS – JavaScript game engine now at version 14+
• Axios – Popular Promise-based HTTP client now at version 1+
• Tesseract.js – Image to text library now at version 3+

Testing and Debugging Tools

5 Lessons of Mobile App Security Testing
The makers of ProGuard set out to solve the gap between mobile app security and time to market with the launch of AppSweep, a free mobile app security testing tool. Here are the top five lessons we’ve learned a year later.   SPONSORED 

JavaScript Makeup
An simple online JavaScript playground that includes a console, ability to create "tabs" for different "files", and there's a minimap for scrolling through the code.

Intl Explorer
An online guide that includes an interactive playground for experimenting and trying out the ECMAScript Internationalization API.

jest-native
A set of custom Jest matchers that you can use to extend Jest, to make your tests more declarative, clearer to read, and easier to maintain.

Derive Type
Generate TypeScript type definitions based on function invocations and embed them as JSDoc comments in your JavaScript code.

Sandworm
Easily audit and sandbox for your JavaScript dependencies, generate a security profile for your app, and secure your app against supply chain attacks.

memlab
A utility that analyzes the JavaScript heap and finds memory leaks in the browser and Node.js.

Fishery
A library for setting up JavaScript objects for use in tests and anywhere else you need to set up data, loosely modeled after a similar Ruby gem.

ttvc
Utility from the Dropbox team that provides an in-browser implementation of the VisuallyComplete metric suitable for field data collection (real-user monitoring).

Website Speed Test
Enter a URL to test a page's load time from different geo locations, then this tool will display various metrics and details along with an overall score.

Step CI
A language-agnostic, open-source tool that makes testing and monitoring APIs simple, and works seamlessly with Node, Docker, and GitHub Actions.

 

The Uncategorizables

5 Lessons of Mobile App Security Testing
The makers of ProGuard set out to solve the gap between mobile app security and time to market with the launch of AppSweep, a free mobile app security testing tool. Here are the top five lessons we’ve learned a year later.   SPONSORED 

TypeRunner
A high-performance TypeScript compiler and parser written in C++.

Authing
An authentication SDK for JavaScript, Miniapp, and Node.js, for sign-in, sign-out, SSO, user identities, etc.

Agreper
Python-based forum software with a focus on being easy to set up and manage.

Turnstile
From Cloudflare, a better free CAPTCHA alternative. Available in the dashboard for current customers or fill out the form if not using Cloudflare.

Javet
Java + V8, a way of embedding Node.js and V8 in Java.

Devbox
Instant, easy, and predictable shells and containers. Isolated local shells on your laptop and build images without Dockerfiles.

Jiter
Just In Time (JIT) webhooks. Skip the hassle of configuring cron jobs and dealing with timezones. Currently free but will eventually include a pay model.

Dub
An open-source Bitly alternative, a link shortener with built-in analytics and free custom domains.

Serverless Offline
A plugin for the Serverless framework that emulates AWS Lambda and API Gateway on your local machine to speed up your development cycles.

LinkFree
An open-source alternative to Linktree, implemented in JavaScript.

Lychee
A self-hosted photo-management app built in PHP, to manage, share, and view photo collections.

Plasma Bigscreen
An open-source user interface for TVs, running on top of a Linux distribution, that turns your TV or setup-box into a fully hackable device.
 

Commercial Apps and Classifieds

A Tweet for Thought

I know we're supposed to be kind and not judge one another, but I can live with this kind of judgement.
   

Send Me Your Tools!

Made something? Send links via Direct Message on Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
 

Before I Go...

Spreadsheet Gaming lets you download Excel files that are actually playable golf games. Not code golf, but regular golf, allowing you to see the power of Excel when it comes to interactive content.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris