Files
Janka UrygaandGitHub 669c52e393 typechecking inputs/outputs in action transform tests (#75935)
This PR attempts to add typechecking to the server actions tests
fixtures in order to add an extra layer of validation against compiler
bugs. (there's a couple!). Unfortunately the tests were pretty
loosey-goosey around undefined variables, so there's a lot of noise in
adding missing imports for `Button` etc. i tried to call out the
interesting changes via PR comments.

Note that this is a bit limited, because we often have to rely on
typescript inferring some sensible types for the outputs -- see e.g. the
issue with `24/output.js` mentioned below. In case typescript can't
infer sensible types for something, we can just exclude that file from
checking. this seems to be pretty rare, so i think it's okay.

We should also definitely add typechecking to the other fixture folders,
but this PR is already big, so i want to do that piecemeal.

### TODO
- [x] invoke the typechecker in CI
- added a `check-compiler-fixtures` script that runs as part of
`types-and-precompiled` (open to feedback, maybe this isn't the right
place?)
- [x] figure out how to make `tsc` error on
`crates/next-custom-transforms/tests/fixture/server-actions/server-graph/51/output.js`,
where we're referencing a non-existent variable `$$RSC_SERVER_ACTION_0`.
right now, it emits no errors
- this is a compiler bug, and i want to catch bugs like this in the
future
  - solution: https://github.com/vercel/next.js/pull/75944
- [x] figure out why `tsc` is complaining about a type mismatch in
`crates/next-custom-transforms/tests/fixture/server-actions/server-graph/24/output.js`
- we can work around this by loosening the types for
`registerServerReference`, but i'd rather we didn't have to do that
- this seems to be a bizarre TS behavior where `fn.bind(...)` makes all
the params optional in JS files. ignoring this for now
2025-02-24 16:59:34 +00:00

33 lines
610 B
JavaScript

import { Button } from 'components'
import deleteFromDb from 'db'
const v1 = 'v1'
export function Item({ id1, id2 }) {
const v2 = id2
return (
<>
<Button
action={async () => {
'use server'
await deleteFromDb(id1)
await deleteFromDb(v1)
await deleteFromDb(v2)
}}
>
Delete
</Button>
<Button
action={async function () {
'use server'
await deleteFromDb(id1)
await deleteFromDb(v1)
await deleteFromDb(v2)
}}
>
Delete
</Button>
</>
)
}