Fix example active-class-anme: Add support for children of ActiveLink without a className. #9271

mgrubinger · 2019-10-31T14:50:19Z

The ActiveLink component in active-class-name example would output class="undefined active" for the current route if the child of ActiveLink did not have a className.

This PR fixes this issue.

Example:

<ActiveLink href="/about" activeClassName="active">
  <a>About</a>
</ActiveLink>

produced: class="undefined active"
with this PR: class="active"

happy 🎃

… without a className.

ijjk · 2019-10-31T14:57:21Z

Stats from current PR

Default Server Mode

General

	zeit/next.js canary	mgrubinger/next.js canary	Change
buildDuration	13.7s	13.9s	⚠️ +225ms
nodeModulesSize	48.5 MB	48.5 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.js	16.6 kB	16.6 kB	✓
main-HASH.js gzip	5.86 kB	5.86 kB	✓
webpack-HASH.js	1.53 kB	1.53 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
16b1a7225520..63e75d588.js	19.7 kB	19.7 kB	✓
16b1a7225520..d588.js gzip	7.23 kB	7.23 kB	✓
4952ddcd88e7..bfe360fe6.js	10.5 kB	10.5 kB	✓
4952ddcd88e7..0fe6.js gzip	4.06 kB	4.06 kB	✓
commons.HASH.js	11.3 kB	11.3 kB	✓
commons.HASH.js gzip	4.23 kB	4.23 kB	✓
de003c3a9d30..9e9c1d310.js	28.6 kB	28.6 kB	✓
de003c3a9d30..d310.js gzip	10.8 kB	10.8 kB	✓
framework.1b..cdcfe1283.js	125 kB	125 kB	✓
framework.1b..1283.js gzip	39.4 kB	39.4 kB	✓
Overall change	214 kB	214 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.module.js	14.1 kB	14.1 kB	✓
main-HASH.module.js gzip	5.28 kB	5.28 kB	✓
webpack-HASH.module.js	1.53 kB	1.53 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
16b1a7225520..51.module.js	15.8 kB	15.8 kB	✓
16b1a7225520..dule.js gzip	6.07 kB	6.07 kB	✓
4952ddcd88e7..4a.module.js	12.8 kB	12.8 kB	✓
4952ddcd88e7..dule.js gzip	4.75 kB	4.75 kB	✓
de003c3a9d30..c0.module.js	22.1 kB	22.1 kB	✓
de003c3a9d30..dule.js gzip	8.68 kB	8.68 kB	✓
framework.5b..d3.module.js	125 kB	125 kB	✓
framework.5b..dule.js gzip	39.4 kB	39.4 kB	✓
Overall change	192 kB	192 kB	✓

Client Pages

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.js	1.63 kB	1.63 kB	✓
_app.js gzip	788 B	788 B	✓
_error.js	12.3 kB	12.3 kB	✓
_error.js gzip	4.79 kB	4.79 kB	✓
hooks.js	1.92 kB	1.92 kB	✓
hooks.js gzip	941 B	941 B	✓
index.js	318 B	318 B	✓
index.js gzip	222 B	222 B	✓
link.js	5.81 kB	5.81 kB	✓
link.js gzip	2.56 kB	2.56 kB	✓
routerDirect.js	413 B	413 B	✓
routerDirect.js gzip	285 B	285 B	✓
withRouter.js	423 B	423 B	✓
withRouter.js gzip	284 B	284 B	✓
Overall change	22.8 kB	22.8 kB	✓

Client Pages Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.module.js	1.54 kB	1.54 kB	✓
_app.module.js gzip	759 B	759 B	✓
_error.module.js	10.5 kB	10.5 kB	✓
_error.module.js gzip	4.26 kB	4.26 kB	✓
hooks.module.js	1.52 kB	1.52 kB	✓
hooks.module.js gzip	792 B	792 B	✓
index.module.js	292 B	292 B	✓
index.module.js gzip	223 B	223 B	✓
link.module.js	5.49 kB	5.49 kB	✓
link.module.js gzip	2.47 kB	2.47 kB	✓
routerDirect.module.js	399 B	399 B	✓
routerDirect..dule.js gzip	285 B	285 B	✓
withRouter.module.js	409 B	409 B	✓
withRouter.m..dule.js gzip	282 B	282 B	✓
Overall change	20.2 kB	20.2 kB	✓

Client Build Manifests

	zeit/next.js canary	mgrubinger/next.js canary	Change
_buildManifest.js	244 B	244 B	✓
_buildManifest.js gzip	199 B	199 B	✓
_buildManifest.module.js	251 B	251 B	✓
_buildManife..dule.js gzip	210 B	210 B	✓
Overall change	495 B	495 B	✓

Rendered Page Sizes

	zeit/next.js canary	mgrubinger/next.js canary	Change
index.html	N/A	3.94 kB	N/A
index.html gzip	N/A	1 kB	N/A
link.html	N/A	4.47 kB	N/A
link.html gzip	N/A	1.08 kB	N/A
withRouter.html	N/A	4.47 kB	N/A
withRouter.html gzip	N/A	1.07 kB	N/A
Overall change	0 B	12.9 kB	✓

Serverless Mode

General

	zeit/next.js canary	mgrubinger/next.js canary	Change
buildDuration	13.9s	14.2s	⚠️ +243ms
nodeModulesSize	48.5 MB	48.5 MB	✓

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.js	16.6 kB	16.6 kB	✓
main-HASH.js gzip	5.86 kB	5.86 kB	✓
webpack-HASH.js	1.53 kB	1.53 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
16b1a7225520..63e75d588.js	19.7 kB	19.7 kB	✓
16b1a7225520..d588.js gzip	7.23 kB	7.23 kB	✓
4952ddcd88e7..bfe360fe6.js	10.5 kB	10.5 kB	✓
4952ddcd88e7..0fe6.js gzip	4.06 kB	4.06 kB	✓
commons.HASH.js	11.3 kB	11.3 kB	✓
commons.HASH.js gzip	4.23 kB	4.23 kB	✓
de003c3a9d30..9e9c1d310.js	28.6 kB	28.6 kB	✓
de003c3a9d30..d310.js gzip	10.8 kB	10.8 kB	✓
framework.1b..cdcfe1283.js	125 kB	125 kB	✓
framework.1b..1283.js gzip	39.4 kB	39.4 kB	✓
Overall change	214 kB	214 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.module.js	14.1 kB	14.1 kB	✓
main-HASH.module.js gzip	5.28 kB	5.28 kB	✓
webpack-HASH.module.js	1.53 kB	1.53 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
16b1a7225520..51.module.js	15.8 kB	15.8 kB	✓
16b1a7225520..dule.js gzip	6.07 kB	6.07 kB	✓
4952ddcd88e7..4a.module.js	12.8 kB	12.8 kB	✓
4952ddcd88e7..dule.js gzip	4.75 kB	4.75 kB	✓
de003c3a9d30..c0.module.js	22.1 kB	22.1 kB	✓
de003c3a9d30..dule.js gzip	8.68 kB	8.68 kB	✓
framework.5b..d3.module.js	125 kB	125 kB	✓
framework.5b..dule.js gzip	39.4 kB	39.4 kB	✓
Overall change	192 kB	192 kB	✓

Client Pages

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.js	1.63 kB	1.63 kB	✓
_app.js gzip	788 B	788 B	✓
_error.js	12.3 kB	12.3 kB	✓
_error.js gzip	4.79 kB	4.79 kB	✓
hooks.js	1.92 kB	1.92 kB	✓
hooks.js gzip	941 B	941 B	✓
index.js	318 B	318 B	✓
index.js gzip	222 B	222 B	✓
link.js	5.81 kB	5.81 kB	✓
link.js gzip	2.56 kB	2.56 kB	✓
routerDirect.js	413 B	413 B	✓
routerDirect.js gzip	285 B	285 B	✓
withRouter.js	423 B	423 B	✓
withRouter.js gzip	284 B	284 B	✓
Overall change	22.8 kB	22.8 kB	✓

Client Pages Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.module.js	1.54 kB	1.54 kB	✓
_app.module.js gzip	759 B	759 B	✓
_error.module.js	10.5 kB	10.5 kB	✓
_error.module.js gzip	4.26 kB	4.26 kB	✓
hooks.module.js	1.52 kB	1.52 kB	✓
hooks.module.js gzip	792 B	792 B	✓
index.module.js	292 B	292 B	✓
index.module.js gzip	223 B	223 B	✓
link.module.js	5.49 kB	5.49 kB	✓
link.module.js gzip	2.47 kB	2.47 kB	✓
routerDirect.module.js	399 B	399 B	✓
routerDirect..dule.js gzip	285 B	285 B	✓
withRouter.module.js	409 B	409 B	✓
withRouter.m..dule.js gzip	282 B	282 B	✓
Overall change	20.2 kB	20.2 kB	✓

Client Build Manifests

	zeit/next.js canary	mgrubinger/next.js canary	Change
_buildManifest.js	244 B	244 B	✓
_buildManifest.js gzip	199 B	199 B	✓
_buildManifest.module.js	251 B	251 B	✓
_buildManife..dule.js gzip	210 B	210 B	✓
Overall change	495 B	495 B	✓

Serverless bundles

	zeit/next.js canary	mgrubinger/next.js canary	Change
_error.js	241 kB	241 kB	✓
_error.js gzip	64.4 kB	64.4 kB	✓
hooks.html	4.08 kB	4.08 kB	✓
hooks.html gzip	1.03 kB	1.03 kB	✓
index.js	241 kB	241 kB	✓
index.js gzip	64.5 kB	64.5 kB	✓
link.js	274 kB	274 kB	✓
link.js gzip	73.5 kB	73.5 kB	✓
routerDirect.js	267 kB	267 kB	✓
routerDirect.js gzip	71.5 kB	71.5 kB	✓
withRouter.js	267 kB	267 kB	✓
withRouter.js gzip	71.6 kB	71.6 kB	✓
Overall change	1.29 MB	1.29 MB	✓

Commit: c09ec2f

examples/active-class-name/components/ActiveLink.js

Co-Authored-By: Luis Alvarez D. <luis@zeit.co>

ijjk · 2019-10-31T19:00:43Z

Stats from current PR

Default Server Mode (Increase detected ⚠️)

General Overall increase ⚠️

	zeit/next.js canary	mgrubinger/next.js canary	Change
buildDuration	14.7s	15.5s	⚠️ +771ms
nodeModulesSize	48.5 MB	48.5 MB	⚠️ +171 B

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.js	16.6 kB	16.6 kB	✓
main-HASH.js gzip	5.86 kB	5.86 kB	✓
webpack-HASH.js	1.53 kB	1.53 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
16b1a7225520..63e75d588.js	19.7 kB	19.7 kB	✓
16b1a7225520..d588.js gzip	7.23 kB	7.23 kB	✓
4952ddcd88e7..bfe360fe6.js	10.5 kB	10.5 kB	✓
4952ddcd88e7..0fe6.js gzip	4.06 kB	4.06 kB	✓
commons.HASH.js	11.3 kB	11.3 kB	✓
commons.HASH.js gzip	4.23 kB	4.23 kB	✓
de003c3a9d30..9e9c1d310.js	28.6 kB	28.6 kB	✓
de003c3a9d30..d310.js gzip	10.8 kB	10.8 kB	✓
framework.1b..cdcfe1283.js	125 kB	125 kB	✓
framework.1b..1283.js gzip	39.4 kB	39.4 kB	✓
Overall change	214 kB	214 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.module.js	14.1 kB	14.1 kB	✓
main-HASH.module.js gzip	5.28 kB	5.28 kB	✓
webpack-HASH.module.js	1.53 kB	1.53 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
16b1a7225520..51.module.js	15.8 kB	15.8 kB	✓
16b1a7225520..dule.js gzip	6.07 kB	6.07 kB	✓
4952ddcd88e7..4a.module.js	12.8 kB	12.8 kB	✓
4952ddcd88e7..dule.js gzip	4.75 kB	4.75 kB	✓
de003c3a9d30..c0.module.js	22.1 kB	22.1 kB	✓
de003c3a9d30..dule.js gzip	8.68 kB	8.68 kB	✓
framework.5b..d3.module.js	125 kB	125 kB	✓
framework.5b..dule.js gzip	39.4 kB	39.4 kB	✓
Overall change	192 kB	192 kB	✓

Client Pages

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.js	1.63 kB	1.63 kB	✓
_app.js gzip	788 B	788 B	✓
_error.js	12.3 kB	12.3 kB	✓
_error.js gzip	4.79 kB	4.79 kB	✓
hooks.js	1.92 kB	1.92 kB	✓
hooks.js gzip	941 B	941 B	✓
index.js	318 B	318 B	✓
index.js gzip	222 B	222 B	✓
link.js	5.81 kB	5.81 kB	✓
link.js gzip	2.56 kB	2.56 kB	✓
routerDirect.js	413 B	413 B	✓
routerDirect.js gzip	285 B	285 B	✓
withRouter.js	423 B	423 B	✓
withRouter.js gzip	284 B	284 B	✓
Overall change	22.8 kB	22.8 kB	✓

Client Pages Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.module.js	1.54 kB	1.54 kB	✓
_app.module.js gzip	759 B	759 B	✓
_error.module.js	10.5 kB	10.5 kB	✓
_error.module.js gzip	4.26 kB	4.26 kB	✓
hooks.module.js	1.52 kB	1.52 kB	✓
hooks.module.js gzip	792 B	792 B	✓
index.module.js	292 B	292 B	✓
index.module.js gzip	223 B	223 B	✓
link.module.js	5.49 kB	5.49 kB	✓
link.module.js gzip	2.47 kB	2.47 kB	✓
routerDirect.module.js	399 B	399 B	✓
routerDirect..dule.js gzip	285 B	285 B	✓
withRouter.module.js	409 B	409 B	✓
withRouter.m..dule.js gzip	282 B	282 B	✓
Overall change	20.2 kB	20.2 kB	✓

Client Build Manifests

	zeit/next.js canary	mgrubinger/next.js canary	Change
_buildManifest.js	244 B	244 B	✓
_buildManifest.js gzip	199 B	199 B	✓
_buildManifest.module.js	251 B	251 B	✓
_buildManife..dule.js gzip	210 B	210 B	✓
Overall change	495 B	495 B	✓

Rendered Page Sizes

	zeit/next.js canary	mgrubinger/next.js canary	Change
index.html	3.94 kB	3.94 kB	✓
index.html gzip	1 kB	1 kB	✓
link.html	4.47 kB	4.47 kB	✓
link.html gzip	1.08 kB	1.08 kB	✓
withRouter.html	4.47 kB	4.47 kB	✓
withRouter.html gzip	1.07 kB	1.07 kB	✓
Overall change	12.9 kB	12.9 kB	✓

Serverless Mode (Increase detected ⚠️)

General Overall increase ⚠️

	zeit/next.js canary	mgrubinger/next.js canary	Change
buildDuration	15.7s	15.1s	-603ms
nodeModulesSize	48.5 MB	48.5 MB	⚠️ +171 B

Client Bundles (main, webpack, commons)

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.js	16.6 kB	16.6 kB	✓
main-HASH.js gzip	5.86 kB	5.86 kB	✓
webpack-HASH.js	1.53 kB	1.53 kB	✓
webpack-HASH.js gzip	746 B	746 B	✓
16b1a7225520..63e75d588.js	19.7 kB	19.7 kB	✓
16b1a7225520..d588.js gzip	7.23 kB	7.23 kB	✓
4952ddcd88e7..bfe360fe6.js	10.5 kB	10.5 kB	✓
4952ddcd88e7..0fe6.js gzip	4.06 kB	4.06 kB	✓
commons.HASH.js	11.3 kB	11.3 kB	✓
commons.HASH.js gzip	4.23 kB	4.23 kB	✓
de003c3a9d30..9e9c1d310.js	28.6 kB	28.6 kB	✓
de003c3a9d30..d310.js gzip	10.8 kB	10.8 kB	✓
framework.1b..cdcfe1283.js	125 kB	125 kB	✓
framework.1b..1283.js gzip	39.4 kB	39.4 kB	✓
Overall change	214 kB	214 kB	✓

Client Bundles (main, webpack, commons) Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
main-HASH.module.js	14.1 kB	14.1 kB	✓
main-HASH.module.js gzip	5.28 kB	5.28 kB	✓
webpack-HASH.module.js	1.53 kB	1.53 kB	✓
webpack-HASH..dule.js gzip	746 B	746 B	✓
16b1a7225520..51.module.js	15.8 kB	15.8 kB	✓
16b1a7225520..dule.js gzip	6.07 kB	6.07 kB	✓
4952ddcd88e7..4a.module.js	12.8 kB	12.8 kB	✓
4952ddcd88e7..dule.js gzip	4.75 kB	4.75 kB	✓
de003c3a9d30..c0.module.js	22.1 kB	22.1 kB	✓
de003c3a9d30..dule.js gzip	8.68 kB	8.68 kB	✓
framework.5b..d3.module.js	125 kB	125 kB	✓
framework.5b..dule.js gzip	39.4 kB	39.4 kB	✓
Overall change	192 kB	192 kB	✓

Client Pages

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.js	1.63 kB	1.63 kB	✓
_app.js gzip	788 B	788 B	✓
_error.js	12.3 kB	12.3 kB	✓
_error.js gzip	4.79 kB	4.79 kB	✓
hooks.js	1.92 kB	1.92 kB	✓
hooks.js gzip	941 B	941 B	✓
index.js	318 B	318 B	✓
index.js gzip	222 B	222 B	✓
link.js	5.81 kB	5.81 kB	✓
link.js gzip	2.56 kB	2.56 kB	✓
routerDirect.js	413 B	413 B	✓
routerDirect.js gzip	285 B	285 B	✓
withRouter.js	423 B	423 B	✓
withRouter.js gzip	284 B	284 B	✓
Overall change	22.8 kB	22.8 kB	✓

Client Pages Modern

	zeit/next.js canary	mgrubinger/next.js canary	Change
_app.module.js	1.54 kB	1.54 kB	✓
_app.module.js gzip	759 B	759 B	✓
_error.module.js	10.5 kB	10.5 kB	✓
_error.module.js gzip	4.26 kB	4.26 kB	✓
hooks.module.js	1.52 kB	1.52 kB	✓
hooks.module.js gzip	792 B	792 B	✓
index.module.js	292 B	292 B	✓
index.module.js gzip	223 B	223 B	✓
link.module.js	5.49 kB	5.49 kB	✓
link.module.js gzip	2.47 kB	2.47 kB	✓
routerDirect.module.js	399 B	399 B	✓
routerDirect..dule.js gzip	285 B	285 B	✓
withRouter.module.js	409 B	409 B	✓
withRouter.m..dule.js gzip	282 B	282 B	✓
Overall change	20.2 kB	20.2 kB	✓

Client Build Manifests

	zeit/next.js canary	mgrubinger/next.js canary	Change
_buildManifest.js	244 B	244 B	✓
_buildManifest.js gzip	199 B	199 B	✓
_buildManifest.module.js	251 B	251 B	✓
_buildManife..dule.js gzip	210 B	210 B	✓
Overall change	495 B	495 B	✓

Serverless bundles

	zeit/next.js canary	mgrubinger/next.js canary	Change
_error.js	241 kB	241 kB	✓
_error.js gzip	64.4 kB	64.4 kB	✓
hooks.html	4.08 kB	4.08 kB	✓
hooks.html gzip	1.03 kB	1.03 kB	✓
index.js	241 kB	241 kB	✓
index.js gzip	64.5 kB	64.5 kB	✓
link.js	274 kB	274 kB	✓
link.js gzip	73.5 kB	73.5 kB	✓
routerDirect.js	267 kB	267 kB	✓
routerDirect.js gzip	71.5 kB	71.5 kB	✓
withRouter.js	267 kB	267 kB	✓
withRouter.js gzip	71.6 kB	71.6 kB	✓
Overall change	1.29 MB	1.29 MB	✓

Commit: eaef671

lfades · 2019-10-31T19:05:00Z

Thank you 💯

Fix example active-class-anme: Add support for children of ActiveLink…

c09ec2f

… without a className.

mgrubinger requested review from lfades and Timer as code owners October 31, 2019 14:50

lfades reviewed Oct 31, 2019

View reviewed changes

examples/active-class-name/components/ActiveLink.js Outdated Show resolved Hide resolved

lfades approved these changes Oct 31, 2019

View reviewed changes

Update examples/active-class-name/components/ActiveLink.js

eaef671

Co-Authored-By: Luis Alvarez D. <luis@zeit.co>

lfades merged commit 81066a3 into vercel:canary Oct 31, 2019

This was referenced Nov 19, 2019

[Snyk] Upgrade next from 9.1.2 to 9.1.3 ndom91/newtelco-next-maintenance-mgmt#10

Merged

[Snyk] Upgrade next from 9.0.4 to 9.1.3 ajesse11x/now-examples#17

Open

vercel locked as resolved and limited conversation to collaborators Jan 31, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix example active-class-anme: Add support for children of ActiveLink without a className. #9271

Fix example active-class-anme: Add support for children of ActiveLink without a className. #9271

mgrubinger commented Oct 31, 2019

ijjk commented Oct 31, 2019

ijjk commented Oct 31, 2019

lfades commented Oct 31, 2019

Fix example active-class-anme: Add support for children of ActiveLink without a className. #9271

Fix example active-class-anme: Add support for children of ActiveLink without a className. #9271

Conversation

mgrubinger commented Oct 31, 2019

ijjk commented Oct 31, 2019

Stats from current PR

ijjk commented Oct 31, 2019

Stats from current PR

lfades commented Oct 31, 2019