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

fix(angular): use initialize function when setting up ionic angular to avoid config errors #24004

Merged
merged 3 commits into from
Oct 4, 2021

Conversation

studioromeo
Copy link
Contributor

@studioromeo studioromeo commented Oct 1, 2021

Pull request checklist

Please check if your PR fulfills the following requirements:

  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been reviewed and added / updated if needed (for bug fixes / features)
  • Build (npm run build) was run locally and any changes were pushed
  • Lint (npm run lint) has passed locally and any fixes were made for failures

Pull request type

Please check the type of change your PR introduces:

  • Bugfix
  • Feature
  • Code style update (formatting, renaming)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • Documentation content changes
  • Other (please describe):

What is the current behavior?

When angular bootstraps it sets Ionic.config regardless of whether it is set or not. This is fine in normal applications such as serving in the browser where angular is only initialised once.

However in karma test suites angular is initialised on every test case but the window object persists between all test cases which causes ionic/angular to overwrite the config with something that is not compatible with the core components. This has been reported in #22853 as config.get throwing warnings when using ion-segment but I guess the issue could be for any components that use the config object.

Issue Number: 22853

What is the new behavior?

Now during startup ionic/angular checks to see if Ionic.config is set. If it is it does not do anything with that variable. This seems to solve the problem described in #22853 and I've not noticed any adverse effects when stepping through the event listeners in helpers that were previously failing because the config had been overwritten with another object

Does this introduce a breaking change?

  • Yes
  • No

Other information

When inspecting Ionic.config on a second test case

Before After
Screenshot 2021-10-01 at 15 30 04 Screenshot 2021-10-01 at 15 28 48

PS: I wasn't able to find any tests for this part and running npm test gave me angular no tests yet. If theres some tests I need to write let me know and also how I should run the test suite.

When karma runs each test case the window object persists. Ionic does
some initial setup in angular first before handing over to core.

On each test case in karma angular bootstraps itself again, during this
bootstrap we set Ionic.config. On the first test case this is fine as Ionic
core is also bootstrapped but on the second test case this overwrites
legitimate config which causes parts of Ionic to fail as the config is
no longer in the expected format.

This fix works by only setting Ionic.config if it does not already
exist. If it does exist then we do not replace it with an object thats
not compatible with core.

There may be better ways to solve this issue but I didn't want to change
too much of ionic/angular so this felt like the safest change
@github-actions github-actions bot added the package: angular @ionic/angular package label Oct 1, 2021
@liamdebeasi
Copy link
Contributor

Thanks for the PR! We appreciate the work you put into making this.

I pushed a commit to your branch with an alternative way of fixing this issue. Ionic React and Ionic Vue call an initialize function exported from Ionic Core which lets you initialize (or re-initialize) the config without destroying the old Config object. This is a relatively new function, so Ionic Angular was never using it. Tests seem to work fine with this change. Additionally, developers will be able to change configs in between tests without any errors.

Once the build passes I will merge this PR. Thanks again!

@liamdebeasi liamdebeasi changed the title fix(angular): config.get not a function in karma (#22853) fix(angular): use initialize function when setting up ionic angular to avoid config errors Oct 1, 2021
@liamdebeasi
Copy link
Contributor

Here is a dev build if you are interested in testing:

npm install @ionic/angular@5.9.0-dev.202110012020.519054b

@liamdebeasi liamdebeasi merged commit f112ad4 into ionic-team:main Oct 4, 2021
@liamdebeasi
Copy link
Contributor

Merged. Thank you!

@studioromeo
Copy link
Contributor Author

Hey. I gave the dev build a test and all seemed to work as expected, thanks for the merge 🥳

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: angular @ionic/angular package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants