Version 8.0 #581

mwislek · 2022-12-06T21:56:46Z

Upgrade all dependency minor versions
Upgrade Node version to ^18.12.1
Upgrade webpack, css-loader, style-loader, and sass-loader to their later versions.

Because there were significant changes in several of the library versions as well as a change to the engines configuration, this update is being treated as a major update.

This work is being done as part of a client-template upgrade comparable to the update done for the Ionic client template.

Release Notes

This version contains the following breaking changes:

Upgraded Node version to 18.12.1
Removed node-sass in favor of sass
Upgraded webpack and related loaders

Further explanation of each item is detailed below.

1. Upgraded Node version to 18.12.1

Typically, the Node version of an application can be updated without any breaking change. However, Node 18 requires an upgraded version of glibc. This has impact on Travis.

The default distribution used for builds and test execution (xenial) does not have the version of glibc required by Node 18. See this Travis community forum note for a discussion of this issue. See this Node issue for a discussion of the new glibc version requirement.

To resolve this issue, a specific Linux distribution (focal) is specified in the .travis.yml configuration file. This disribution has the correct glibc version. See this Travis documentation for a description of the focal build environment.

This version of lp-components will not support older Node versions. You must use Node version ^18.12.1.

2. Removed `node-sass` in favor of `sass`

node-sass has been deprecated and the latest version does not support the later glibc version (an exception is generated when one tries to execute node-sass with the later Node version). To resolve this, node-sass was removed and sass (Dart Sass, the currently active Sass implementation) was added. This change required an additional update to the build:styles script to use sass for style builds.

3. Upgraded webpack and related loaders

The Node upgrade mentioned above also fixed an OpenSSL issue. That fix required that the latest version of Webpack be used, along with configuration of a specific hashing function. To accommodate this change, webpack was upgraded to ^5.75.0 and the css-loader, style-loader, and sass-loader were also upgraded to their latest versions.

Author Checklist

Add unit test(s)
Update version in package.json (see the versioning guidelines)
Update documentation (if necessary)
Add story to storybook (if necessary)
Assign dev reviewer

mwislek · 2022-12-06T21:58:06Z

.storybook/main.js

@@ -1,4 +1,7 @@
 module.exports = {
+  core: {


Needed to upgrade to webpack 5 in order to resolve issues with Node 18 and SSL. See: https://stackoverflow.com/questions/69692842/error-message-error0308010cdigital-envelope-routinesunsupported

mwislek · 2022-12-06T21:58:38Z

.storybook/webpack.config.js

@@ -9,7 +9,11 @@ module.exports = async ({ config }) => {
  // Storysource-addon
  config.module.rules.push({
    test: /\.story\.jsx?$/,
-    loaders: [require.resolve('@storybook/source-loader')],
+    use: [


Needed to change the webpack configuration in order to accommodate webpack 5.

.travis.yml

package.json

chawes13

Can you see if a review app can be spun up for this PR? We may never had turned that on for this repo, but it would be nice to have.

chawes13 · 2022-12-08T22:50:30Z

.storybook/webpack.config.js

@@ -39,5 +43,12 @@ module.exports = async ({ config }) => {
      src: path.resolve(__dirname, '../src'),
    },
  }
+  // Required for Node ^18.12.1 to resolve an OpenSSL configuraiton deprecation.


Typo: configuration

package.json

chawes13 · 2022-12-08T22:56:28Z

src/styles/modal.css

@@ -0,0 +1,114 @@
+body.modal-open {


Where did this file come from? Do consumers of this library need to reference this file in any way?

Hmm. No idea. I certainly didn't add it intentionally. Removed...

chawes13 · 2022-12-08T23:01:15Z

migration-guides/v8.0.0.md

+
+Typically, the Node version of an application can be updated without any breaking change. However, Node 18 requires an upgraded version of `glibc`. This has impact on both Travis and the existing `node-sass` executable.
+
+For Travis, the default distribution used for builds and test execution does not have the version of `glibc` required by Node 18. To resolve this issue, a specific distribution is specified in the `.travis.yml` configuration file that has the correct `glibc` version.


Can you reference the distribution name directly in this paragraph please? Any official docs from Travis to reference for more info?

chawes13 · 2022-12-08T23:02:53Z

migration-guides/v8.0.0.md

+
+For Travis, the default distribution used for builds and test execution does not have the version of `glibc` required by Node 18. To resolve this issue, a specific distribution is specified in the `.travis.yml` configuration file that has the correct `glibc` version.
+
+`node-sass` has been deprecated and the latest version does not support the later `glibc` version (an exception is generated when one tries to execute `node-sass` with the later Node version). To resolve this, `node-sass` was removed and `sass` (Dart Sass, the currently active Sass implementation) was added. This change required an additional update to the `build:styles` script to use `sass` for style builds.


Let's add this paragraph to the section below.

chawes13 · 2022-12-08T23:04:28Z

migration-guides/v8.0.0.md

+
+## 2. Removed `node-sass` in favor of `sass`
+
+As mentioned above, `node-sass` was removed in favor of `sass`. Additionally, the latest version of `style-loader` was included in this version of `lp-components`.


Is the style-loader note relevant in this section? Seems like your mention of it in #3 is sufficient enough IMO

That's fine. Removed.

migration-guides/v8.0.0.md

mwislek · 2022-12-09T02:21:46Z

Can you see if a review app can be spun up for this PR? We may never had turned that on for this repo, but it would be nice to have.

Would a review app do anything? There are no views in this file. There is supposed to be a storybook deployment to Heroku though. Does that no longer work? Or was the request for a "review app" storybook deployment?

chawes13 · 2022-12-09T14:30:23Z

Can you see if a review app can be spun up for this PR? We may never had turned that on for this repo, but it would be nice to have.

Would a review app do anything? There are no views in this file. There is supposed to be a storybook deployment to Heroku though. Does that no longer work? Or was the request for a "review app" storybook deployment?

Exactly, I want to see the storybook deployment

mwislek · 2022-12-09T22:23:38Z

Exactly, I want to see the storybook deployment

@chawes13 Cool. I don't see the http://lp-components.herokuapp.com/storybook app when I log into the LPL Heroku instance. I am a "member" in the launchpadlab Heroku team instead of an "admin", which may be the issue. Do you see the app? If so, can you give me admin-level access to it so that I can configure the review app?

chawes13 · 2022-12-12T15:22:40Z

Exactly, I want to see the storybook deployment

@chawes13 Cool. I don't see the http://lp-components.herokuapp.com/storybook app when I log into the LPL Heroku instance. I am a "member" in the launchpadlab Heroku team instead of an "admin", which may be the issue. Do you see the app? If so, can you give me admin-level access to it so that I can configure the review app?

@mwislek I just added you as a pipeline member. Let me know if that gives you enough permissions. It looks like the pipeline was disconnected after the Heroku security incident, which requires manual reconnection.

mwislek · 2022-12-12T15:44:22Z

@mwislek I just added you as a pipeline member. Let me know if that gives you enough permissions. It looks like the pipeline was disconnected after the Heroku security incident, which requires manual reconnection.

@chawes13 Still don't see it. My permissions on the launchpadlab Heroku team are: https://share.getcloudapp.com/jkuOQvdd/. Could that be the reason I don't even see the app?

chawes13

Just a few non-blocking typos! This Node change being breaking is really annoying 😞 . I worry about getting buy-in from many existing apps to make this upgrade.

Maybe there's a best practice guide that could summarize / distill the work that you did in the client-template (since we don't have a migration guide concept there)?

chawes13 · 2022-12-12T15:40:41Z

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,5 +1,9 @@
 <!-- Include description and link to resolved issue(s) here. -->

+## Release Notes
+<!-- Optional description of the resolve issue(s) that will be included in the -->


Typo: resolved

Oh man. Sorry about these.

chawes13 · 2022-12-12T15:41:20Z

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,5 +1,9 @@
 <!-- Include description and link to resolved issue(s) here. -->

+## Release Notes
+<!-- Optional description of the resolve issue(s) that will be included in the -->
+<!-- Github release description of this library. -->


Typo: GitHub

chawes13 · 2022-12-12T15:47:57Z

@mwislek I just added you as a pipeline member. Let me know if that gives you enough permissions. It looks like the pipeline was disconnected after the Heroku security incident, which requires manual reconnection.

@chawes13 Still don't see it. My permissions on the launchpadlab Heroku team are: https://share.getcloudapp.com/jkuOQvdd/. Could that be the reason I don't even see the app?

It's not in launchpadlab. It's in launchpadlab-dev! I'm surprised you didn't get an email invitation 🤔

mwislek · 2022-12-12T15:51:59Z

@chawes13 No email invitation. I don't even see the "Access" tab on launchpadlab-dev but believe I am a "Collaborator". Don't see the lp-components app though.

chawes13 · 2022-12-12T15:57:23Z

Ok. I just changed your permissions, connected GitHub to the repo, and enabled review apps

mwislek · 2022-12-12T16:22:53Z

Maybe there's a best practice guide that could summarize / distill the work that you did in the client-template (since we don't have a migration guide concept there)?

Would the "Release Notes" I added to this PR's description suffice or were you thinking of something new? I was assuming that this blurb about the Node version would be included in the release notes for all of the libraries that upgraded to Node 18. I included this same blurb in the client-template PR as well.

mwislek added 3 commits December 5, 2022 15:42

chore: upgrade Node and all minor dependencies

d51ea07

chore: specify travis distrubution

175c24c

chore: upgrade webpack and loaders

c98affd

mwislek commented Dec 6, 2022

View reviewed changes

.travis.yml Show resolved Hide resolved

mwislek commented Dec 6, 2022

View reviewed changes

package.json Show resolved Hide resolved

mwislek commented Dec 6, 2022

View reviewed changes

package.json Show resolved Hide resolved

mwislek commented Dec 6, 2022

View reviewed changes

package.json Show resolved Hide resolved

mwislek requested a review from chawes13 December 6, 2022 22:00

chawes13 reviewed Dec 8, 2022

View reviewed changes

doc: simplify migration documentation

c80c8d4

mwislek requested a review from chawes13 December 9, 2022 01:49

chore: remove unneeded file

a37f83f

mwislek added 2 commits December 9, 2022 16:24

docs: add optional release notes section to the pull request template

b1ec311

docs: correct typo

660fc78

chawes13 approved these changes Dec 12, 2022

View reviewed changes

mwislek merged commit c3c21d5 into main Dec 12, 2022

mwislek deleted the version-8.0 branch December 12, 2022 16:26

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Version 8.0 #581

Version 8.0 #581

mwislek commented Dec 6, 2022 •

edited

Loading

mwislek Dec 6, 2022

mwislek Dec 6, 2022

chawes13 left a comment

chawes13 Dec 8, 2022

chawes13 Dec 8, 2022

mwislek Dec 9, 2022

chawes13 Dec 8, 2022

chawes13 Dec 8, 2022

chawes13 Dec 8, 2022

mwislek Dec 9, 2022

mwislek commented Dec 9, 2022

chawes13 commented Dec 9, 2022

mwislek commented Dec 9, 2022

chawes13 commented Dec 12, 2022

mwislek commented Dec 12, 2022

chawes13 left a comment •

edited

Loading

chawes13 Dec 12, 2022

mwislek Dec 12, 2022

chawes13 Dec 12, 2022

chawes13 commented Dec 12, 2022 •

edited

Loading

mwislek commented Dec 12, 2022

chawes13 commented Dec 12, 2022

mwislek commented Dec 12, 2022


		Typically, the Node version of an application can be updated without any breaking change. However, Node 18 requires an upgraded version of `glibc`. This has impact on both Travis and the existing `node-sass` executable.

		For Travis, the default distribution used for builds and test execution does not have the version of `glibc` required by Node 18. To resolve this issue, a specific distribution is specified in the `.travis.yml` configuration file that has the correct `glibc` version.


		For Travis, the default distribution used for builds and test execution does not have the version of `glibc` required by Node 18. To resolve this issue, a specific distribution is specified in the `.travis.yml` configuration file that has the correct `glibc` version.

		`node-sass` has been deprecated and the latest version does not support the later `glibc` version (an exception is generated when one tries to execute `node-sass` with the later Node version). To resolve this, `node-sass` was removed and `sass` (Dart Sass, the currently active Sass implementation) was added. This change required an additional update to the `build:styles` script to use `sass` for style builds.


		## 2. Removed `node-sass` in favor of `sass`

		As mentioned above, `node-sass` was removed in favor of `sass`. Additionally, the latest version of `style-loader` was included in this version of `lp-components`.

Version 8.0 #581

Version 8.0 #581

Conversation

mwislek commented Dec 6, 2022 • edited Loading

Release Notes

1. Upgraded Node version to 18.12.1

2. Removed node-sass in favor of sass

3. Upgraded webpack and related loaders

Author Checklist

Choose a reason for hiding this comment

Choose a reason for hiding this comment

chawes13 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

mwislek commented Dec 9, 2022

chawes13 commented Dec 9, 2022

mwislek commented Dec 9, 2022

chawes13 commented Dec 12, 2022

mwislek commented Dec 12, 2022

chawes13 left a comment • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

chawes13 commented Dec 12, 2022 • edited Loading

mwislek commented Dec 12, 2022

chawes13 commented Dec 12, 2022

mwislek commented Dec 12, 2022

mwislek commented Dec 6, 2022 •

edited

Loading

2. Removed `node-sass` in favor of `sass`

chawes13 left a comment •

edited

Loading

chawes13 commented Dec 12, 2022 •

edited

Loading