Tram-One, now with Types! Typescript! v11.0.0

JRJurman commented 2 years ago

Summary

In an effort to get the advantages of type safety, this PR migrates the source code (and most of the tests) to Typescript.

This gives the project more type safety, and allows our consumers to build projects with type safety (if they are using Typescript). If they aren't using Typescript they still will get proper type annotations when working with compatible editors (such as Visual Studio Code).

Changes

All the changes listed below are detailed in the comments, treat these as a high level breakdown.

Bump Major - v11.0.0

In reality, this might not be breaking for JS projects, but there are a significant number of changes (including the removal of some safety checks for JS and addition of checks for TS). Anyone using Typescript would start getting compile time errors / warnings, so for that reason alone really it should be considered a breaking change.

Main Changes

Remove manual type checking in the project
Remove manual JS Doc annotations
types.ts file for typescript type definitions

Auxiliary Changes

Using Prettier instead XO
Expand ...args for more clear parameter definitions
Fix file JSDoc blocks to not be associated with a variable
Fixed Document TreeWalker to properly filter elements
Removed server-side rendering support

Testing Changes

Added new test for verifying root-defined effects
Created #176 (we lost code coverage for elements that have scroll position, in reality, we probably never actually had coverage for these, and it was being ignored)

Artifacts: https://github.com/Tram-One/tram-one/compare/typescript...typescript-artifacts

Note about the artifacts

For some reason, CircleCI slowed down between the last master run and this changeset. This was confirmed with a dummy PR which had similar slowdowns (with no changes).

Checklist

[x] PR Summary
[x] Update tsconfig to be strict
[x] Update DocStrings
[x] Verify DocStrings
[x] Update Build tooling for Modules
[x] Manual Verification in a JS Project
[x] Manual Verification in a TS Project
[x] Investigate slower speeds (run dummy PR against master)
[x] Update top-level README
[x] PR Comments (Initial Pass)
[x] PR Comments (Final Pass)
[x] Update Linter (now including prettier)
[x] Tests
[x] Version Bump
[x] Code Coverage Review

Post Merge Checklist

[ ] Update Website

JRJurman commented 2 years ago

A lot of the runtime checks can actually be removed now that we verify the return type of Tram-One Components

JRJurman commented 2 years ago

When playing around in a typescript project, people can use the following syntax to verify the component follows the correct interface:

import { registerHtml, TramOneComponent } from 'tram-one'

const html = registerHtml()

const AppHeader: TramOneComponent  = (props, children) => {
    return html`
        <h1 class="app-header">
            ${children}
        </h1>
    `
}

export default AppHeader

Tram-One / tram-one