Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] - Type instantiation is excessively deep and possibly infinite. #17

Open
sndrem opened this issue Jan 5, 2023 · 7 comments
Open

Comments

@sndrem
Copy link

sndrem commented Jan 5, 2023

Describe the bug
Not sure if a bug, but when I tried to use the toFormikValidationSchema(Schema), I get a warning saying Type instantiation is excessively deep and possibly infinite.. This seems to stress the typescript server in vs code. If I comment out this line validationSchema={toFormikValidationSchema(Schema)} then VS Code works as expected. Not sure why this is. I have not had this problem in the past. I just updated to version 1.2.0.

To Reproduce
Steps to reproduce the behavior:

  1. Update to version 1.2.0
  2. Add validationSchema={toFormikValidationSchema(Schema)} to your Formik component
  3. It should give a warning about Type instantiation is excessively deep and possibly infinite

Expected behavior
I expect the code to not give errors and validate my form as expected

Screenshots
image

Desktop (please complete the following information):

  • MacOS Ventura 13.1

Node version:

Zod, Formik and zod-formik-adapter versions:
zod: "^3.20.2",
zod-formik-adapter: "^1.2.0",
formik: "^2.2.9"
Typescript: 4.9.4

Additional context
I have tried to turn my computer on and off, restarted the ts server in vs code, and restarted vs code. It only seems to be working correctly if I do not include the validationSchema.

import { BodyLong, Heading, TextField } from "@navikt/ds-react";
import { FieldHookConfig, Form, Formik, useField } from "formik";
import { z } from "zod";
import { toFormikValidationSchema } from "zod-formik-adapter";
import styles from "../tiltaksgjennomforinger/Oversikt.module.scss";

const Schema = z.object({
  tiltakstypenavn: z.string({ required_error: "Tiltakstypen må ha et navn" }),
});

type SchemaValues = z.infer<typeof Schema>;

function Tekstfelt({
  label,
  name,
  ...props
}: { name: keyof SchemaValues; label: string } & FieldHookConfig<any>) {
  const [field, meta] = useField({ name, ...props });
  return <TextField label={label} {...field} error={meta.error} />;
}

export function OpprettTiltakstype() {
  const initialValues = { tiltakstypenavn: "" };
  return (
    <>
      <Heading className={styles.overskrift} size="large">
        Opprett ny tiltakstype
      </Heading>
      <BodyLong className={styles.body} size="small">
        Her kan du opprette eller redigere en tiltakstype
      </BodyLong>
      <Formik<SchemaValues>
        initialValues={initialValues}
        validationSchema={toFormikValidationSchema(Schema)} // TODO Se på toFormikValidationSchema og hvorfor den kneler Typescript-serveren
        onSubmit={(values, actions) => {
          setTimeout(() => {
            alert(JSON.stringify(values, null, 2));
            actions.setSubmitting(false);
          }, 1000);
        }}
      >
        {() => (
          <Form>
            <Tekstfelt name="tiltakstypenavn" label="Navn" />
            <button type="submit">Opprett</button>
          </Form>
        )}
      </Formik>
    </>
  );
}
@sndrem
Copy link
Author

sndrem commented Jan 5, 2023

If i downgrade to 1.1.1 then everything works as expected

@robertLichtnow
Copy link
Owner

Can you also provide the Typescript version that your TS server is using?

@sndrem
Copy link
Author

sndrem commented Jan 9, 2023

4.9.4 is the typescript version being used. I have updated my original question as well.

@awkaiser-tr
Copy link
Contributor

awkaiser-tr commented Jan 25, 2023

FWIW, I'm also seeing this error on 1.2.0 with TypeScript 4.7.4

Best I can tell, the only change since 1.1.1 that could possibly impact toFormikValidationSchema behavior would be the change from Zod ~3.14.4 to ^3.14.4, since Zod is up to 3.20.2 now. 🤔

Unfortunately, if I downgrade my project to exactly Zod 3.14.4 while remaining on Zod Formik Adapter 1.2.0, then restart my TS server in VS Code, the error still occurs! 😖 NPM dependency hell is "fun" to troubleshoot when project behavior can differ by when dependencies were frozen in lockfile.

For now, downgrading both zod & zod-formik-adapter is the only thing that provides relief:

"zod": "~3.14.4",
"zod-formik-adapter": "~1.1.1"

... and then we're back to this library having an opinion about React compatibility 😦

@samuelg0rd0n
Copy link

This issue happens to me, as well 😦

"typescript": "5.1.6",
(...)
"zod": "^3.22.4",
"zod-formik-adapter": "^1.2.0",

@salmanrf
Copy link

I'm getting this error as well, has there been any fix ?

@valajczech
Copy link

Same here on 1.3.0. The only solution I could find for now is either to @ts-ignore it or downgrade to 1.1.1 as per @sndrem's answer.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants