microsoft / TypeScript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
https://www.typescriptlang.org
Apache License 2.0
100.91k stars 12.47k forks source link

Proposal: strictJsxAttributeChecks #46229

Open DanielRosenwasser opened 3 years ago

DanielRosenwasser commented 3 years ago

When TypeScript checks if provided attributes match a given type, it exempts dashed attributes from being checked against things like index signatures.

import React from 'react';

interface Props {
    [prop: string]: number;
}

function MyComponent(x: Props) {
    return <div />
}

// No error.
<MyComponent foo-bar={"hello"} />

This applies to all index signatures, even string pattern index signatures that match.

import React from 'react';

interface Props {
    [prop: `data-${string}`]: number;
}

function MyComponent(x: Props) {
    return <div />
}

// No error.
<MyComponent data-bar={"hello"} />

Under this new --strict mode flag, these properties would be strictly checked in the presence of an index signature.

This issue is a possible alternative for https://github.com/microsoft/TypeScript/issues/44797. Instead of validating against a specific set of index signatures, this idea in this proposal is to tighten checking against all index signatures under a new strict-mode flag.

✅ Viability Checklist

My suggestion meets these guidelines:

💻 Use Cases

One of the motivating examples for template string types was index patterns on object types. This was something that specifically came up in discussions with library authors of Fluent UI; however, this checking doesn't fully apply to JSX attributes, which seems like an unfortunate accident.

DanielRosenwasser commented 3 years ago

I think we need some experimentation here. PRs are welcome, but the team feels a bit divided about the value that this brings compared to the potential breakage and the overhead of yet another flag. For that reason, even if results are mildly good (i.e. this catches a few legitimate bugs) we might not end up merging that PR.