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.

Sign up for GitHub

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

Jump to bottom

[mui-codemod] mui-replace does not update package.json as documented #40362

Closed
2 tasks done
awanlin opened this issue Dec 29, 2023 · 11 comments · Fixed by #40536
Closed
2 tasks done

[mui-codemod] mui-replace does not update package.json as documented #40362

awanlin opened this issue Dec 29, 2023 · 11 comments · Fixed by #40536
Assignees
@ZeeshanTamboli
Labels
bug 🐛 Something doesn't work package: codemod Specific to @mui/codemod

Comments

@awanlin
Copy link

awanlin commented Dec 29, 2023

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Steps to reproduce 🕹

Link to live example: https://github.com/backstage/demo

Steps:

  1. Run git clone https://github.com/backstage/demo
  2. Run yarn install
  3. Run npx @mui/codemod@latest v5.0.0/mui-replace .

Notice: the package.json is not changed though the documentation indicates it should be: https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#mui-replace:~:text=mui/lab/Mansory%27%3B-,Dependencies,-//%20package.json%0A%2D

Current behavior 😯

All the code files are updates as expected but the package.json file is not

Expected behavior 🤔

The package.json file should be updated with the proper changes as per the documentation: https://github.com/mui/material-ui/blob/master/packages/mui-codemod/README.md#mui-replace:~:text=mui/lab/Mansory%27%3B-,Dependencies,-//%20package.json%0A%2D

Context 🔦

We are slowly working on migrating Backstage to Material UI v5 from v4 and would like to use as much automation as possible. Ideally we want to be able to tell our adopters to use npx @mui/codemod v5.0.0/preset-safe which includes mui-replace but until this issue is fixed we can't do so.

Your environment 🌎

I've included this as asked but it's not listing the right versions as we are still using packages from @material-ui/*:

https://github.com/backstage/demo/blob/084c8181fe7a1100dff458ef2ae87f290792edbe/packages/app/package.json#L36-L38

Also, I have not included browser details as that doesn't come into play with this issue.

npx @mui/envinfo 
  System:
    OS: macOS 14.2.1
  Binaries:
    Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node
    Yarn: 3.5.0 - ~/.nvm/versions/node/v18.18.2/bin/yarn
    npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm
  Browsers:
    Chrome: 120.0.6099.129
    Edge: 120.0.2210.91
    Safari: 17.2.1
  npmPackages:
    @emotion/react:  11.11.1
    @emotion/styled:  11.11.0
    @mui/base:  5.0.0-beta.24
    @mui/core-downloads-tracker:  5.14.18
    @mui/material:  5.14.18
    @mui/private-theming:  5.14.18
    @mui/styled-engine:  5.14.18
    @mui/system:  5.14.18
    @mui/types:  7.2.9
    @mui/utils:  5.14.18
    @types/react:  17.0.71
    react:  18.2.0
    react-dom:  18.2.0
    typescript: ~5.2.0 => 5.2.2
@awanlin awanlin added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Dec 29, 2023
@zannager zannager added the package: codemod Specific to @mui/codemod label Jan 1, 2024
@ZeeshanTamboli
Copy link
Member

Thanks for the report. I believe the problem is caused by the fact that it doesn't take into account json files for transformation (see here). I'll work on creating a pull request.

@ZeeshanTamboli ZeeshanTamboli added bug 🐛 Something doesn't work and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Jan 11, 2024
@ZeeshanTamboli ZeeshanTamboli self-assigned this Jan 11, 2024
@ZeeshanTamboli ZeeshanTamboli mentioned this issue Jan 11, 2024
Merged
1 task
@awanlin
Copy link
Author

awanlin commented Jan 14, 2024

Thanks for looking into this and submitting a PR to fix it @ZeeshanTamboli. Would you be able to give me a rough timeline as to what the process is like for this to be reviewed, merged, and published, please? I can understand that you can't give me exact dates, just estimates works for me 👍

@ZeeshanTamboli
Copy link
Member

ZeeshanTamboli commented Jan 15, 2024 •
edited
Loading

@awanlin The merge will happen upon approval, and the publication will occur during our weekly release. I'll make an effort to expedite this PR with the reviewers, but I cannot provide a guarantee.

@awanlin
Copy link
Author

awanlin commented Jan 15, 2024

Thanks, that works for me, I know these things take time but it looks like it got merged! When do the weekly releases happen? Excited to test this out on my end 🚀

@ZeeshanTamboli
Copy link
Member

When do the weekly releases happen?

It will happen at the start of this week. Might be today or tomorrow.

@awanlin
Copy link
Author

awanlin commented Jan 21, 2024

Finally got time to test this out and I'm hitting an error:

~/repos/forks/backstage/plugins/azure-devops (master)> npx @mui/codemod@latest v5.0.0/preset-safe .
Need to install the following packages:
@mui/[email protected]
Ok to proceed? (y) y
Executing command: jscodeshift /Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node_modules/jscodeshift/bin/jscodeshift.js --transform /Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node/v5.0.0/preset-safe.js --extensions js,ts,jsx,tsx,json --parser tsx --ignore-pattern **/node_modules/** /Users/awanlin/repos/forks/backstage/plugins/azure-devops
Processing 86 files...
Spawning 11 workers...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 8 files to free worker...
Sending 6 files to free worker...
 ERR /Users/awanlin/repos/forks/backstage/plugins/azure-devops/package.json Transformation error (Missing semicolon. (2:8))
SyntaxError: Missing semicolon. (2:8)
    at toParseError (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parse-error.ts:81:19)
    at TypeScriptParserMixin.raise (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/tokenizer/index.ts:1487:19)
    at TypeScriptParserMixin.semicolon (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/util.ts:141:10)
    at TypeScriptParserMixin.parseExpressionStatement (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:1313:10)
    at TypeScriptParserMixin.parseExpressionStatement (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/plugins/typescript/index.ts:3044:28)
    at TypeScriptParserMixin.parseStatementContent (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:659:19)
    at TypeScriptParserMixin.parseStatementContent (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/plugins/typescript/index.ts:2887:20)
    at TypeScriptParserMixin.parseStatementLike (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:416:17)
    at TypeScriptParserMixin.parseStatementListItem (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:365:17)
    at TypeScriptParserMixin.parseBlockOrModuleBlockBody (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:1394:16)
    at TypeScriptParserMixin.parseBlockBody (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:1367:10)
    at TypeScriptParserMixin.parseBlock (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:1335:10)
    at TypeScriptParserMixin.parseStatementContent (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:563:21)
    at TypeScriptParserMixin.parseStatementContent (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/plugins/typescript/index.ts:2887:20)
    at TypeScriptParserMixin.parseStatementLike (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:416:17)
    at TypeScriptParserMixin.parseModuleItem (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:353:17)
    at TypeScriptParserMixin.parseBlockOrModuleBlockBody (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:1393:16)
    at TypeScriptParserMixin.parseBlockBody (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:1367:10)
    at TypeScriptParserMixin.parseProgram (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:212:10)
    at TypeScriptParserMixin.parseTopLevel (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/statement.ts:194:25)
    at TypeScriptParserMixin.parse (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/parser/index.ts:45:10)
    at TypeScriptParserMixin.parse (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/plugins/typescript/index.ts:3999:20)
    at Object.parse (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@babel/parser/src/index.ts:66:38)
    at Object.parse (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node_modules/jscodeshift/parser/tsx.js:24:22)
    at Object.parse (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/recast/lib/parser.js:23:30)
    at fromSource (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node_modules/jscodeshift/src/core.js:82:25)
    at core (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node_modules/jscodeshift/src/core.js:44:5)
    at j (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node_modules/jscodeshift/src/core.js:142:12)
    at transformer (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node/v5.0.0/adapter-v4.js:13:16)
    at transformer (/Users/awanlin/.npm/_npx/2aacf93ee2439f59/node_modules/@mui/codemod/node/v5.0.0/preset-safe.js:63:38)
All done.
Results:
1 errors
71 unmodified
0 skipped
14 ok
Time elapsed: 3.574seconds

Steps to reproduce:

Notice you get the error above

@ZeeshanTamboli
Copy link
Member

@awanlin I reproduced the issue, and it seems to be related to jscodeshift - either facebook/jscodeshift#559 or facebook/jscodeshift#539. Running the following command works for me:

npx @mui/codemod@latest v5.0.0/preset-safe ./package.json --parser=flow

I'm uncertain about any actions we can take on our side.

@awanlin
Copy link
Author

awanlin commented Jan 23, 2024

Thanks for taking a look into this @ZeeshanTamboli, I'll try that command as well and report back. I think in our case that should be satisfactory 👍

@awanlin
Copy link
Author

awanlin commented Jan 28, 2024

Just got around to trying this out and though it works without errors the versions aren't updated so running yarn install fails. This screenshot should explain what I mean:

image

It simply changes the names but what it should be doing is also updating the package versions. Not sure how that would work, perhaps this feature should juts be removed? 🤔

@ZeeshanTamboli
Copy link
Member

The mui-replace codemod only updates package names, not the version. You'll need to handle the version update manually.

@awanlin
Copy link
Author

awanlin commented Jan 29, 2024

Thanks for confirming, should the docs be updated to clarify that? I feel like others would have made that assumption as well. 🤔

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ZeeshanTamboli ZeeshanTamboli

Labels
bug 🐛 Something doesn't work package: codemod Specific to @mui/codemod
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

[codemod] Allow json files to be transformed ZeeshanTamboli/material-ui
4 participants
@siriwatknp @ZeeshanTamboli @awanlin @zannager