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

Upgrade helix-front to Angular 12.2 #2131

Merged
merged 5 commits into from
Jun 3, 2022
Merged

Upgrade helix-front to Angular 12.2 #2131

merged 5 commits into from
Jun 3, 2022

Conversation

micahstubbs
Copy link
Contributor

Issues

  • My PR addresses the following Helix issues and references them in the PR description:

Fix #2112

Description

  • Here are some details about my PR, including screenshots of any UI changes:

This PR upgrades helix-front to Angular 12.2.

This PR completely contains earlier helix-front upgrade PRs #2111, #2104, #2094, #2092, #2087, #2083, and #2078. These previous Angular major-version PRs should be merged first.

Tests

-Let's test the upgrade from Angular 11.2 to Angular 12.2.

  • npm install works
  • npm run type:check:watch shows 0 TypeScript errors
  • npm run lint runs and passes All files pass linting.
  • npm run build works
  • npm start works, with 0 errors in the browser console.
  • npm run test runs and passes.

npm start works as expected, and recognizes our proxy config in proxy.conf.json.

Screen Shot 2022-05-23 at 7 16 09 PM

Helix UI renders with 0 errors in the browser console.

npm run test results

Screen Shot 2022-05-23 at 7 40 40 PM

Documentation

  • In case of new functionality, my PR adds documentation in the following wiki page:

Not applicable since this PR does not contain new functionality, only tooling and dependency upgrades.

Code Quality

  • My diff has been formatted using helix-style.xml
    (helix-style-intellij.xml if IntelliJ IDE is used)

Not applicable since this PR does not make any changes to the Java codebase.

@micahstubbs micahstubbs mentioned this pull request Jun 1, 2022
Closed
10 tasks
@micahstubbs micahstubbs force-pushed the 2112/upgrade-to-angular-12.2-clean branch 2 times, most recently from 6048c46 to 3c1f3d4 Compare June 3, 2022 00:18
@micahstubbs
parent ed990b8
16e146e 
author Micah Stubbs <micah.stubbs@gmail.com> 1651701734 -0700
committer Micah Stubbs <micah.stubbs@gmail.com> 1654124422 -0700

parent ed990b8
author Micah Stubbs <micah.stubbs@gmail.com> 1651701734 -0700
committer Micah Stubbs <micah.stubbs@gmail.com> 1654124376 -0700

ng update @angular/cli --from=5.2.11 --to=6 --migrate-only

npm i -D rxjs-tslint, add rxjs specific linting rules, add lint:tslint alternative linting script

npm install @angular/cdk@6.1.0

npm install @angular/{animations,cdk,common,compiler,compiler-cli,core,forms,material,platform-browser,platform-browser-dynamic,platform-server,router}@6.1.0

npm i ajv@6.9.1

npm i codelyzer@6.0.1

npm i ngx-clipboard@11.1.5

npm i tsickle@0.32.1

restore rxjs-compat@6.0.0-rc.0 to fix rxjs issue at npm run build

WIP state with new Reactive Form

Revert "WIP state with new Reactive Form"

This reverts commit f9e2e37.
@micahstubbs
parent 017555c
925614b 
author Micah Stubbs <micah.stubbs@gmail.com> 1652219675 -0700
committer Micah Stubbs <micah.stubbs@gmail.com> 1654124644 -0700

parent ed990b8
author Micah Stubbs <micah.stubbs@gmail.com> 1651701734 -0700
committer Micah Stubbs <micah.stubbs@gmail.com> 1654124422 -0700

parent ed990b8
author Micah Stubbs <micah.stubbs@gmail.com> 1651701734 -0700
committer Micah Stubbs <micah.stubbs@gmail.com> 1654124376 -0700

ng update @angular/cli --from=5.2.11 --to=6 --migrate-only

npm i -D rxjs-tslint, add rxjs specific linting rules, add lint:tslint alternative linting script

npm install @angular/cdk@6.1.0

npm install @angular/{animations,cdk,common,compiler,compiler-cli,core,forms,material,platform-browser,platform-browser-dynamic,platform-server,router}@6.1.0

npm i ajv@6.9.1

npm i codelyzer@6.0.1

npm i ngx-clipboard@11.1.5

npm i tsickle@0.32.1

restore rxjs-compat@6.0.0-rc.0 to fix rxjs issue at npm run build

WIP state with new Reactive Form

Revert "WIP state with new Reactive Form"

This reverts commit f9e2e37.

upgrade to typescript@^3.2.4

pin typescript at 3.2.4

manually update @angular/material to ^7.2.16

npm i @angular/flex-layout@7.0.0-beta.24

npm i tsickle@0.34.2

npm i @swimlane/ngx-datatable@14.0.0

npm i @swimlane/ngx-graph@6.0.0-rc.2

ObservableMedia --> MediaObserver to handle breaking change introduce in @angular/flex-layout@7.0.0-beta.23

npm i @swimlane/ngx-charts@11.2.0

manually upgrade to Angular 8.2.14 and associated major deps

fix new TypeScript errors

update bundle target to ES2015 since Angular 8 now automatically creates an ES5 compat build too

@ViewChild {static: true}

NG_DISABLE_VERSION_CHECK=1 npx @angular/cli@8 update @angular/material@8 --force

use @angular/core@8.2.3 and friends, fix bad upgrade script that jumped ahead to v9

npm i typescript@3.5.3

npm i zone.js@~0.9.1

npm i tsickle@0.37.0

npm i @angular/flex-layout@8.0.0-beta.27

npm i @swimlane/ngx-datatable@16.0.0

npm i @ngtools/webpack@9.0.0-next.7

npm uninstall node-sass && npm i sass

nvm use 10.9.0 && npm i

manually update material imports, use deep imports

npm i -D @angular-devkit/build-angular@0.803.29

npm i ngx-clipboard@12.1.2

npm i @swimlane/ngx-charts@13.0.4

npm i @swimlane/ngx-graph@7.0.0

npm i @swimlane/ngx-datatable@16.0.3

npm i @swimlane/ngx-datatable@16.1.0

update ngx-datatable style paths: no longer a release folder

nvm use 10.13.0

Angular CLI update for packages - @angular/core@9, @angular/cli@9

@angular/cli migration - workspace-version-9
Angular Workspace migration. Update an Angular CLI workspace to version 9.

@angular/cli migration - schematic-options-9
Replace deprecated 'styleext' and 'spec' Angular schematic options.

npm i tsickle@0.38.1

add generic type to ModuleWithProviders in app routing module

npm i rxjs@6.5.5

NG_DISABLE_VERSION_CHECK=1 npx @angular/cli@9 update @angular/material@9 --force

npm i @angular/flex-layout@9.0.0-beta.31

ngForm --> ng-form

npm i angulartics2@9.1.0

Anglartics2Piwik --> Angulartics2Matomo

Revert "Anglartics2Piwik --> Angulartics2Matomo"

This reverts commit 30d00dc.

update piwik import

specify one budget of 500k for initial js needed to bootstrap app

ng-form --> ngForm

npm i ngx-vis@3.1.0

install peer deps for ngx-vis

npm i ngx-vis@2.3.2

Revert "npm i ngx-vis@2.3.2"

This reverts commit 0dd8588.

update dashboard network vis code to new syntax from ngx-vis@3

increase build budget to 3503kb, using current es5 build size as the baseline

use array instead to DataSet to fix tests

temporarily disable tracking lib angulartics to work around v9 bug, re-enable at v10

fix lint config path. should be client

add npm run lint:fix script

npm run lint:fix

disable linting rules that generate new errors for now

remove obsolete property decorator linting rules

remove deprecated linting rules

remove duplicate import, properly turn off linting rules with new failures

npm i

upgrade helix-front to Angular 10.2

remove entryComponents in shared.module.ts since Ivy renderer does not use these

npx @angular/cli@10 update @angular/core@10 @angular/cli@10

npx @angular/cli@10 update @angular/material@10 --force

npm i @angular/flex-layout@10.0.0-beta.32

npm i jasmine-core@3.8

npm i codelyzer@6.0.2

npm i angulartics2@10.1.0

npm i @swimlane/ngx-graph@7.2.0

npm i @swimlane/ngx-graph@7.2.0

npm i @swimlane/ngx-datatable@18.0.0

npm i @swimlane/ngx-charts@16.0.0

nvm use 12.20.2

async --> waitForAsync

async --> waitForAsync in the rest of the tests

mock http calls in config detail component

guard data loading

use HttpClientTestingModule to mock http calls

handle case where not found is returned

add error handling at login service

fix errors with better error handling in user.ts

ng update @angular/core@11 @angular/cli@11 --force

ng update @angular/material@11 --force

npm i @swimlane/ngx-datatable@19.0.0

npm i @swimlane/ngx-graph@8.0.0-rc.2

npm i rxjs@6.6.3

npm i jasmine-core@3.8

npm i timsort@0.3.0

npm run lint --fix

ng update @angular/core@12 @angular/cli@12 --force

ng update @angular/material@12 --force

ng update @angular/cli@12 --migrate-only production-by-default

npm i @angular/flex-layout@12.0.0-beta.35

npm i @swimlane/ngx-datatable@20.0.0

npm i tsickle@0.43.0

update bundle budget to 3.44MB
@micahstubbs
add trailing newline to tsconfig.json
3d5a3f8
@micahstubbs
remove duplicate semicolon
df5aba1
@micahstubbs micahstubbs force-pushed the 2112/upgrade-to-angular-12.2-clean branch from 3c1f3d4 to df5aba1 Compare June 3, 2022 19:30
micahstubbs
micahstubbs commented Jun 3, 2022
View reviewed changes
Copy link
Contributor Author

@micahstubbs micahstubbs left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Self-review complete, LGTM.

@micahstubbs
Copy link
Contributor Author

@somecodemonkey this PR is ready for your review. Thanks for sharing your frontend expertise!

@somecodemonkey
Copy link

👍

@micahstubbs
Copy link
Contributor Author

micahstubbs commented Jun 3, 2022 •
edited

This PR is ready to be merged, approved by @somecodemonkey

Final commit message: Upgrade helix-front to Angular 12.2 Fix #2112

Fix security vulnerabilities in helix-front dependencies.
Upgrade helix-front dependencies to improve contributor productivity.

@junkaixue junkaixue merged commit 4faa5f6 into apache:master Jun 3, 2022
@micahstubbs micahstubbs deleted the 2112/upgrade-to-angular-12.2-clean branch June 3, 2022 19:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

upgrade helix-front to Angular 12.2
3 participants
@micahstubbs @somecodemonkey @junkaixue