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

Missing npm package types #167

Closed
bwswedberg opened this issue Nov 1, 2022 · 6 comments · Fixed by #170
Closed

Missing npm package types #167

bwswedberg opened this issue Nov 1, 2022 · 6 comments · Fixed by #170
Assignees
Labels
bug Something isn't working good first issue Good for newcomers released

Comments

@bwswedberg
Copy link

Describe the bug
A clear and concise description of what the bug is.

The types (dist/*.d.ts) aren't packaged with the npm repo which prevents typescript projects from inferring types.

To Reproduce
Steps to reproduce the behavior:

  1. Create a typescript cypress project
  2. npm install --save-dev @frsource/cypress-plugin-visual-regression-diff
  3. Begin @frsource/cypress-plugin-visual-regression-diff install steps:
import '@frsource/cypress-plugin-visual-regression-diff'; // warning shown here

Could not find a declaration file for module '@frsource/cypress-plugin-visual-regression-diff'. '/Users/.../node_modules/@frsource/cypress-plugin-visual-regression-diff/dist/support.js' implicitly has an 'any' type.
Try npm i --save-dev @types/frsource__cypress-plugin-visual-regression-diff if it exists or add a new declaration (.d.ts) file containing declare module '@frsource/cypress-plugin-visual-regression-diff';ts(7016)

Expected behavior
A clear and concise description of what you expected to happen.

Types to be included in npm package since this is a typescript repo. It looks like they previously were based on the package.json.

image

Screenshots
If applicable, add screenshots to help explain your problem.

image

Please complete the following information:

  • OS and version: [e.g. Windows 10 build. 19043.1319] MacOS 12.4
  • Browser and version [e.g. chrome 22] N/A
  • Cypress version [e.g. 8.6.0] 10.11.0
  • @frsource/cypress-plugin-visual-regression-diff version 3.0.2

Additional context
Add any other context about the problem here.

@bwswedberg bwswedberg added the bug Something isn't working label Nov 1, 2022
@FRSgit FRSgit self-assigned this Nov 1, 2022
@FRSgit
Copy link
Member

FRSgit commented Nov 1, 2022

Hello @bwswedberg, thanks for such detailed bug report, it's really hearth-warming to see those 😄
You're right, the typings were in the package at some point, so it's a regression. Sorry for my mistake - I've introduced an issue by doing an upgrade of microbundle recently.

I've just released version 3.0.3 with a fix, enjoy! 🎉 (and please - confirm here that it works 😄 )

@FRSgit FRSgit closed this as completed Nov 1, 2022
@bwswedberg
Copy link
Author

Thanks for the speedy update!! I really appreciate your effort. It feels like no visual regression tools are keeping pace with cypress releases--so I greatly this!

The fix works as expected for the support type hints found in cypress/support/.... I was able to run .matchImage() in a few tests.

However, when installing I still noticed the types are not coming through in my cypress.config.ts. The below code shows what that looked like. Right now I'm working around it by referencing the "plugins" export directly.

// cypress.config.ts
import { defineConfig } from 'cypress';

// ts: Cannot find module '@frsource/cypress-plugin-visual-regression-diff/plugins' or its corresponding type declarations.
import { initPlugin } from '@frsource/cypress-plugin-visual-regression-diff/plugins';

// Resolves the export w/ types by referencing export directly
import { initPlugin } from '@frsource/cypress-plugin-visual-regression-diff/dist/plugins';

FRSgit added a commit that referenced this issue Nov 2, 2022
closes #167

Signed-off-by: Jakub Freisler <jakub@frsource.org>
FRSgit added a commit that referenced this issue Nov 2, 2022
FRSgit added a commit that referenced this issue Nov 3, 2022
FRSgit added a commit that referenced this issue Nov 3, 2022
FRSgit added a commit that referenced this issue Nov 3, 2022
github-actions bot pushed a commit that referenced this issue Nov 3, 2022
## [3.0.4](v3.0.3...v3.0.4) (2022-11-03)

### Bug Fixes

* typings for older typescript ([#170](#170)) ([96499ec](96499ec)), closes [#167](#167)
@github-actions
Copy link
Contributor

github-actions bot commented Nov 3, 2022

🎉 This issue has been resolved in version 3.0.4 🎉

The release is available on:

Your semantic-release bot 📦🚀

@FRSgit
Copy link
Member

FRSgit commented Nov 3, 2022

There are two things there:

1. Adressing the missing typings issue:

According to the typescript repo, you must set moduleResolution to node16 in your tsconfig.json to make it working with modern exports fields (see here).

But I've found a solution on how to support "older typescript configuration". This got release under version 3.0.4, please try it out (and also, have a look at updated example in this repo).

2. Addressing the issue where you need to still use @frsource/cypress-plugin-visual-regression-diff/dist/support import path when bundling your app with webpack.

This is an issue of Cypress - under the hood, the webpack processor used by Cypress internally is using outdated webpack version 4. This means - no proper support for exports field in package.json (which is the modern node syntax for expressing package exports).

Unfortunately, this issue cannot be handled before Cypress upgrades webpack to v5. Issue that tracks webpack 5 upgrade is here.

@bwswedberg
Copy link
Author

I upgraded to 3.1.0, and those type related issues have been resolved.

Thanks again!!

@FRSgit FRSgit added the good first issue Good for newcomers label Nov 3, 2022
@FRSgit
Copy link
Member

FRSgit commented Nov 3, 2022

Thank you for the bug report! Have a great rest of a week 😄

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working good first issue Good for newcomers released
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants