pr05 Typescript #2: automatically resolve imports of ts files & migrate instance of client/utils file

[clairep94]

pr05 Typescript Migration: Auto-resolve import of ts files & migrate instance of client/utils file

IMPORTANT: Should be reviewed after #3533 for clarity

• This branch is built off of the branch for pr05 Typescript #1: Set up TS dependencies #3533 out of necessity, so there are commits that are unrelated to this ticket
• Relevant commits start at 8b6d4df

Context:

• Resolve issue with needing to update import extensions (eg. from js to ts), so that ts imports automatically resolve for both the client folder & tests
  • Not sure if this resolves imports for the server folder yet -- will resolve this on the PR to migrate an instance of a server file later if so
• Migrate instance of a client/utils file

Changes:

• Auto-resolve imports for local instance of project client folder
• Auto-resolve imports for jest tests
• Migrate client/utils/generateRandomName & associated mock
• Delete client/utils/isSecurePage -- checked and this utility function is unused in the project

Notes:

I have verified that this pull request:

• has no linting errors (npm run lint)
• has no test errors (npm run test)
• is from a uniquely-named feature branch and is up to date with the develop branch.
• is descriptively named and links to an issue number, i.e. Fixes #123

[clairep94]

@khanniie @raclim

Should be reviewed after #3533 is merged for clarity

[khanniie]

LGTM to me so far but would love to re-approve once the first PR is in just to see the diff without the forked changes!

[khanniie]

thanks so much!!! looking great!

[khanniie]

do we need this, if we're not using the types yet?

[khanniie]

this may be a misunderstanding but i thought we'd only need it if we did something like import {aType} from '@types/sdfdsf' to use aType later on?

[clairep94]

Yess that's a good point!! I did some searching to double-check on this bc we also have "skipLibCheck": true(https://github.com/processing/p5.js-web-editor/blob/develop/tsconfig.base.json#L7), which should allow us to not have to have declaration files within packages in node_modules, but I think it works the following way:

• If a file is now in typescript and we import another package from node_modules explicitly (eg. import friendlyWords from 'friendly-words' https://github.com/processing/p5.js-web-editor/pull/3540/files#diff-f9bdb3c3bbc05033b909e04fcb4a39d7cb8b59f78ae786ab477b20a4a765ec53R1, then we need to install the @types package for friendly-words

• If friendly-words has a peer dependency other-package-A that got installed along with it, or if it uses other-package-A internally, we do not need to install @types for other-package-A if we have "skipLibCheck": true in the TS config settings

So I think this is expected, and as we go we will likely have to continue installing @types packages for any third-party packages we are using in a file that is being migrated (eg. react-router-dom, jest-react etc)

https://stackoverflow.com/questions/59906323/typescript-skiplibcheck-still-checking-node-modules-libs

[khanniie]

thank you claire!!

[raclim]

This looks great to me, thanks so much @clairep94 and @khanniie!