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

38 lines
902 B
JavaScript

import { Button } from 'components'
import deleteFromDb from 'db'
export function Item({ id1, id2 }) {
id1++
return (() => {
id1++
return <Button action={deleteItem}>Delete</Button>
})()
async function deleteItem() {
'use server'
await deleteFromDb(id1)
await deleteFromDb(id2)
}
}
// In this example, if Button immediately executes the action, different ids should
// be passed.
export function Item2({ id1, id2 }) {
id1++
const temp = []
temp.push(<Button action={deleteItem}>Delete</Button>)
id1++
temp.push(<Button action={deleteItem}>Delete</Button>)
return temp
// FIXME: invalid transformation of hoisted functions (https://github.com/vercel/next.js/issues/57392)
// (remove output.js from `tsconfig.json#exclude` to see the error)
async function deleteItem() {
'use server'
await deleteFromDb(id1)
await deleteFromDb(id2)
}
}