Bug: typescript build on upgrade: Type '"fast"' is not assignable to type 'IconPrefix'. Did you mean '"fas"'?

ldeveber commented 11 months ago

Bug description

dependabot opened a PR to bump fontawesome, and it broke. I don't see anything mentioned in the changelog about this error being expected? But also unexpected with semver? We are upgrading from 6.4.2.

./src/forms/ViewButton.tsx:22:9
Type error: Type 'IconDefinition' is not assignable to type 'IconProp'.
  Type 'IconDefinition' is not assignable to type 'IconLookup'.
    Types of property 'prefix' are incompatible.
      Type 'import("./node_modules/@fortawesome/free-solid-svg-icons/node_modules/@fortawesome/fontawesome-common-types/index").IconPrefix' is not assignable to type 'import(.node_modules/@fortawesome/fontawesome-common-types/index").IconPrefix'.
        Type '"fast"' is not assignable to type 'IconPrefix'. Did you mean '"fas"'?

   21  |       <FontAwesomeIcon
> 22 |         icon={faArrowUpRightFromSquare}
         |         ^
   23 |         size="sm"
   24 |         style={{ marginLeft: 8 }}
   25 |       />
Error: Process completed with exit code 1.

Font Awesome version

6.5.1

Application and Operating System

app:

nextjs - 14.0.2
typescript - 5.2.2
react - 18.2
antd - 5.11.1

fontawesome:

"@fortawesome/fontawesome-svg-core": "^6.4.2",
"@fortawesome/free-regular-svg-icons": "^6.4.2",
"@fortawesome/free-solid-svg-icons": "^6.4.2",
"@fortawesome/react-fontawesome": "^0.2.0",

Web bug report checklist

[ ] I have included a test case because my odds go way up that the team can fix this when I do
[X] I have searched for existing issues and to the best of my knowledge this is not a duplicate

jh-sh commented 11 months ago

Experiencing the same thing,

    "@fortawesome/fontawesome-svg-core": "^6.5.1",
    "@fortawesome/free-regular-svg-icons": "^6.5.1",
    "@fortawesome/free-solid-svg-icons": "^6.5.1",
    "@fortawesome/pro-regular-svg-icons": "^6.5.1",
    "@fortawesome/pro-solid-svg-icons": "^6.5.1",
    "@fortawesome/react-fontawesome": "^0.2.0",

component library based on @mui/joy-5.0.0.beta.16 typescript 5.4.3

robmadole commented 11 months ago

@ldeveber @jh-sh what is the version of @fortawesome/fontawesome-common-types? It should be aligned with the other versions (fontawesome-svg-core and the free- and pro- packages).

jh-sh commented 10 months ago

Hey @robmadole, we faced those with the specified below: package.json

    "@fortawesome/fontawesome-svg-core": "^6.5.1",
    "@fortawesome/free-regular-svg-icons": "^6.5.1",
    "@fortawesome/free-solid-svg-icons": "^6.5.1",
    "@fortawesome/pro-regular-svg-icons": "^6.5.1",
    "@fortawesome/pro-solid-svg-icons": "^6.5.1",
    "@fortawesome/react-fontawesome": "^0.2.0",

pnpm-lock.yaml

#...
      '@fortawesome/fontawesome-svg-core':
        specifier: ^6.5.1
        version: 6.5.1
      '@fortawesome/free-regular-svg-icons':
        specifier: ^6.5.1
        version: 6.5.1
      '@fortawesome/free-solid-svg-icons':
        specifier: ^6.5.1
        version: 6.5.1
      '@fortawesome/pro-regular-svg-icons':
        specifier: ^6.5.1
        version: 6.5.1
      '@fortawesome/pro-solid-svg-icons':
        specifier: ^6.5.1
        version: 6.5.1
      '@fortawesome/react-fontawesome':
        specifier: ^0.2.0
        version: 0.2.0(@fortawesome/fontawesome-svg-core@6.5.1)(react@18.2.0)
###...
  /@fortawesome/fontawesome-common-types@6.4.2:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dev: false

  /@fortawesome/fontawesome-common-types@6.5.1:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dev: true

  /@fortawesome/fontawesome-svg-core@6.4.2:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dependencies:
      '@fortawesome/fontawesome-common-types': 6.4.2
    dev: false

  /@fortawesome/fontawesome-svg-core@6.5.1:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dependencies:
      '@fortawesome/fontawesome-common-types': 6.5.1
    dev: true

  /@fortawesome/free-regular-svg-icons@6.5.1:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dependencies:
      '@fortawesome/fontawesome-common-types': 6.5.1
    dev: true

  /@fortawesome/free-solid-svg-icons@6.5.1:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dependencies:
      '@fortawesome/fontawesome-common-types': 6.5.1
    dev: true

  /@fortawesome/pro-regular-svg-icons@6.5.1:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dependencies:
      '@fortawesome/fontawesome-common-types': 6.5.1
    dev: true

  /@fortawesome/pro-solid-svg-icons@6.5.1:
    resolution: {integrity: sha512-...}
    engines: {node: '>=6'}
    requiresBuild: true
    dependencies:
      '@fortawesome/fontawesome-common-types': 6.5.1
    dev: true

  /@fortawesome/react-fontawesome@0.2.0(@fortawesome/fontawesome-svg-core@6.4.2)(react@18.2.0):
    resolution: {integrity: sha512-...}
    peerDependencies:
      '@fortawesome/fontawesome-svg-core': ~1 || ~6
      react: '>=16.3'
    dependencies:
      '@fortawesome/fontawesome-svg-core': 6.4.2
      prop-types: 15.8.1
      react: 18.2.0
    dev: false

  /@fortawesome/react-fontawesome@0.2.0(@fortawesome/fontawesome-svg-core@6.5.1)(react@18.2.0):
    resolution: {integrity: sha512-...}
    peerDependencies:
      '@fortawesome/fontawesome-svg-core': ~1 || ~6
      react: '>=16.3'
    dependencies:
      '@fortawesome/fontawesome-svg-core': 6.5.1
      prop-types: 15.8.1
      react: 18.2.0
    dev: true

By going over pnpm-lock.yaml I see duped types (might come from storybook stories or one of the packages). + we had some type inference issue around the code 🙃 Not sure if that can help now, if not - in a couple of days I can try to properly update FA and related packages once again to check.

ldeveber commented 10 months ago

@ldeveber @jh-sh what is the version of @fortawesome/fontawesome-common-types? It should be aligned with the other versions (fontawesome-svg-core and the free- and pro- packages).

Not sure. Our error originally came from a dependabot PR bump, so its totally likely its all out of sync.

From PR:

Screenshot 2023-12-18 at 2 21 00 PM

It does look like it bumped @fortawesome/fontawesome-common-types, but since it was dependabot it didn't bump the others 😂

Screenshot 2023-12-18 at 2 18 52 PM

tagliala commented 10 months ago

This is unrelated, but I would suggest this approach for dependabot for everyone using it:

https://github.com/diowa/ruby3-rails7-bootstrap-heroku/blob/cd107d4009517cd5cf7ba37d8fad21dd9c7c8a01/.github/dependabot.yml#L28-L30

Relevant code:

- package-ecosystem: npm
  # ...
  groups:
    fontawesome:
      patterns:
        - "@fortawesome/*"

Ref: https://docs.github.com/en/code-security/dependabot/dependabot-version-updates/configuration-options-for-the-dependabot.yml-file#groups

@robmadole this may deserve a section in the documentation

andreifilip123 commented 6 months ago

This was really useful! Thank you @tagliala

FortAwesome / Font-Awesome