github(workflows): add package size checks, add auto demo deploy #1048

williaster · 2021-02-05T01:11:09Z

🏠 Internal

Trying to automate some more workflows, this PR updates our github workflow to

split out the CI workflow into push + pull_request workflows since this difference is more relevant now
updates the pull_request workflow to
- run a node script to compute and post package size diffs on PRs
updates the push workflow to
- not run lint, jest, code coverage, or happo on this action type
- commit package size file
- auto-deploy the demo site upon PR merge

@kristw @hshoff

.github/workflows/ci.yml

coveralls · 2021-02-05T01:21:30Z

Pull Request Test Coverage Report for Build 541442101

Warning: This coverage report may be inaccurate.

This pull request's base commit is no longer the HEAD commit of its target branch. This means it includes changes from outside the original pull request, including, potentially, unrelated coverage changes.

For more information on this, see Tracking coverage changes with pull request builds.
To avoid this issue with future PRs, see these Recommended CI Configurations.
For a quick fix, rebase this PR at GitHub. Your next report should be accurate.

Details

0 of 0 changed or added relevant lines in 0 files are covered.
No unchanged relevant lines lost coverage.
Overall coverage remained the same at 61.824%

Totals
Change from base Build 538820361:	0.0%
Covered Lines:	1791
Relevant Lines:	2758

💛 - Coveralls

.github/workflows/ci.yml

williaster · 2021-02-05T02:29:23Z

package.json

-    "type-one": "nimbus typescript --build",
-    "prepare-release": "git checkout master && git pull --rebase origin master && lerna updated",
-    "release": "yarn run prepare-release && lerna publish --exact"
+    "ts": "ts-node --project ./tsconfig.node.json",


ts-node allows running TypeScript scripts. requires the TS config to understand commonjs module format.

…stComment

williaster · 2021-02-05T21:09:14Z

packages/visx-demo/src/sandboxes/visx-axis/Example.tsx

@@ -67,7 +67,8 @@ export default function Example({
  showControls = true,
 }: AxisProps) {
  // use non-animated components if prefers-reduced-motion is set
-  const prefersReducedMotionQuery = window?.matchMedia('(prefers-reduced-motion: reduce)');
+  const prefersReducedMotionQuery =


window.? was throwing in next's SSR environment

williaster · 2021-02-09T03:59:22Z

@hshoff @kristw this should finally be good to go. I validated that the push step on this branch before updating to master, and tested the gh-pages logic on a [gh-test`](https://github.com/airbnb/visx/tree/gh-test) branch.

Had to go through a bunch of hoops to create gh-pages as a worktree within master (left a lot of comments so hopefully it's readable by all).

kristw · 2021-02-09T04:14:19Z

still failing?

github-actions · 2021-02-09T04:32:15Z

Size Changes

Package	Diff	ESM	Prev ESM	CJS	Prev CJS
visx-axis	+0.1%	20.24 KB	20.22 KB	24.54 KB	24.52 KB
visx-visx	🔻 -42.5%	970 B	1.65 KB	8.05 KB	11.18 KB

Compared to master. File sizes are unminified and ungzipped.

View raw build stats

Previous (master)

{
  "visx-annotation": {
    "esm": 27301,
    "lib": 37249
  },
  "visx-axis": {
    "esm": 20708,
    "lib": 25108
  },
  "visx-bounds": {
    "esm": 2842,
    "lib": 3264
  },
  "visx-brush": {
    "esm": 44087,
    "lib": 47832
  },
  "visx-chord": {
    "esm": 3459,
    "lib": 4688
  },
  "visx-clip-path": {
    "esm": 4421,
    "lib": 5978
  },
  "visx-curve": {
    "esm": 323,
    "lib": 1464
  },
  "visx-demo": {
    "esm": 0,
    "lib": 0
  },
  "visx-drag": {
    "esm": 6263,
    "lib": 8300
  },
  "visx-event": {
    "esm": 3797,
    "lib": 5172
  },
  "visx-geo": {
    "esm": 12986,
    "lib": 16246
  },
  "visx-glyph": {
    "esm": 14893,
    "lib": 19789
  },
  "visx-gradient": {
    "esm": 17800,
    "lib": 22517
  },
  "visx-grid": {
    "esm": 8565,
    "lib": 10291
  },
  "visx-group": {
    "esm": 1619,
    "lib": 2246
  },
  "visx-heatmap": {
    "esm": 7286,
    "lib": 8622
  },
  "visx-hierarchy": {
    "esm": 12266,
    "lib": 18076
  },
  "visx-legend": {
    "esm": 26999,
    "lib": 34033
  },
  "visx-marker": {
    "esm": 8962,
    "lib": 11197
  },
  "visx-mock-data": {
    "esm": 326005,
    "lib": 329416
  },
  "visx-network": {
    "esm": 4546,
    "lib": 6706
  },
  "visx-pattern": {
    "esm": 11779,
    "lib": 15910
  },
  "visx-point": {
    "esm": 819,
    "lib": 1094
  },
  "visx-react-spring": {
    "esm": 13450,
    "lib": 17991
  },
  "visx-responsive": {
    "esm": 21872,
    "lib": 26932
  },
  "visx-scale": {
    "esm": 18443,
    "lib": 29701
  },
  "visx-shape": {
    "esm": 83000,
    "lib": 103973
  },
  "visx-stats": {
    "esm": 13911,
    "lib": 15494
  },
  "visx-text": {
    "esm": 8413,
    "lib": 10624
  },
  "visx-threshold": {
    "esm": 2911,
    "lib": 3820
  },
  "visx-tooltip": {
    "esm": 14147,
    "lib": 20326
  },
  "visx-visx": {
    "esm": 1687,
    "lib": 11449
  },
  "visx-voronoi": {
    "esm": 2286,
    "lib": 3005
  },
  "visx-xychart": {
    "esm": 166614,
    "lib": 231961
  },
  "visx-zoom": {
    "esm": 15726,
    "lib": 17398
  }
}

Current

{
  "visx-annotation": {
    "esm": 27301,
    "lib": 37327
  },
  "visx-axis": {
    "esm": 20727,
    "lib": 25127
  },
  "visx-bounds": {
    "esm": 2842,
    "lib": 3264
  },
  "visx-brush": {
    "esm": 44087,
    "lib": 47832
  },
  "visx-chord": {
    "esm": 3459,
    "lib": 4688
  },
  "visx-clip-path": {
    "esm": 4421,
    "lib": 5978
  },
  "visx-curve": {
    "esm": 323,
    "lib": 1464
  },
  "visx-demo": {
    "esm": 0,
    "lib": 0
  },
  "visx-drag": {
    "esm": 6263,
    "lib": 8300
  },
  "visx-event": {
    "esm": 3797,
    "lib": 5172
  },
  "visx-geo": {
    "esm": 12986,
    "lib": 16246
  },
  "visx-glyph": {
    "esm": 14893,
    "lib": 19789
  },
  "visx-gradient": {
    "esm": 17800,
    "lib": 22517
  },
  "visx-grid": {
    "esm": 8565,
    "lib": 10291
  },
  "visx-group": {
    "esm": 1619,
    "lib": 2246
  },
  "visx-heatmap": {
    "esm": 7286,
    "lib": 8622
  },
  "visx-hierarchy": {
    "esm": 12266,
    "lib": 18076
  },
  "visx-legend": {
    "esm": 26999,
    "lib": 34033
  },
  "visx-marker": {
    "esm": 8962,
    "lib": 11197
  },
  "visx-mock-data": {
    "esm": 326005,
    "lib": 329416
  },
  "visx-network": {
    "esm": 4546,
    "lib": 6706
  },
  "visx-pattern": {
    "esm": 11779,
    "lib": 15910
  },
  "visx-point": {
    "esm": 819,
    "lib": 1094
  },
  "visx-react-spring": {
    "esm": 13450,
    "lib": 17991
  },
  "visx-responsive": {
    "esm": 21872,
    "lib": 26932
  },
  "visx-scale": {
    "esm": 18443,
    "lib": 29701
  },
  "visx-shape": {
    "esm": 83000,
    "lib": 103973
  },
  "visx-stats": {
    "esm": 13911,
    "lib": 15494
  },
  "visx-text": {
    "esm": 8413,
    "lib": 10581
  },
  "visx-threshold": {
    "esm": 2911,
    "lib": 3820
  },
  "visx-tooltip": {
    "esm": 14147,
    "lib": 20413
  },
  "visx-visx": {
    "esm": 970,
    "lib": 8243
  },
  "visx-voronoi": {
    "esm": 2286,
    "lib": 3005
  },
  "visx-xychart": {
    "esm": 166614,
    "lib": 232628
  },
  "visx-zoom": {
    "esm": 15726,
    "lib": 17398
  }
}

williaster · 2021-02-09T04:38:02Z

^somethings up with the visx/visx package, but I think it will stabilize when this is merged.

kristw · 2021-02-09T08:09:02Z

.github/workflows/push.yml

+        # - commit the demo site within gh-pages-root-dir/ onto the gh-pages-branch
+        # - push gh-pages-branch to visx as gh-pages. we overwrite history every time so it must be forced
+        run: |
+          git config user.name github-actions


I usually use this package to handle deployment to github pages.
Would it simplify the script here?
https://www.npmjs.com/package/gh-pages

"scripts": { "deploy": "gh-pages -d dist" }

yarn build yarn deploy

Currently we deploy to gh-pages with a simple script in @visx/demo that is similar to these commands. the complexity comes from the creation of a new git worktree without history in the action environment.

tbh I spent so much time on this already I'd rather just leave it. I tried a gh-pages action someone made and it worked, but it requires special handling of credentials which then causes the package size commit to fail. so would have to duplicate the yarn && yarn build steps multiple times which isn't ideal.

williaster added 8 commits February 4, 2021 17:05

internal(deps): add deps for ts-node and filesize computation

7754a8b

internal(node): add tsconfig for node

f385cdf

build: add computeBuildSizes script

6b67007

build: add compareBuildSizes, upsertPullRequestComment scripts

96b1e96

build: update computeBuildSizes output file

b778c4f

build: add deploy-demo script

65d7f0b

github(workflows/ci): add Package sizes + Deploy gallery steps

894c506

github(workflows/ci): add pull_request checks to happo, package sizes

cb085cc

williaster added the 🏠 internal label Feb 5, 2021

williaster added this to the 1.5.0 milestone Feb 5, 2021

williaster commented Feb 5, 2021

View reviewed changes

.github/workflows/ci.yml Outdated Show resolved Hide resolved

williaster commented Feb 5, 2021

View reviewed changes

.github/workflows/ci.yml Outdated Show resolved Hide resolved

williaster added 2 commits February 4, 2021 17:31

deps(dev): add @types/node-fetch

06f90a2

deps: update yarn.lock

85d18be

williaster commented Feb 5, 2021

View reviewed changes

.github/workflows/ci.yml Show resolved Hide resolved

williaster added 2 commits February 4, 2021 17:57

type(scripts/upsertPullRequestComment): fix comment type

c055393

github(workflows): separate CI into push + pull_request

6703ca8

williaster commented Feb 5, 2021

View reviewed changes

williaster marked this pull request as draft February 5, 2021 02:37

williaster added 2 commits February 4, 2021 18:56

deps(dev): add @octokit/rest

fdcc602

fix(workflows/pull_request): add needed variables for upsertPullReque…

1efd7c8

…stComment

williaster marked this pull request as ready for review February 5, 2021 02:57

commit to kick workflow

91f4e6e

williaster closed this Feb 5, 2021

williaster reopened this Feb 5, 2021

github(workflows): fix package size report job

a861a39

williaster force-pushed the chris--moar-ci branch from 2afc943 to a861a39 Compare February 5, 2021 03:09

williaster added 2 commits February 4, 2021 19:11

github(workflow): fix GITHUB_REPOSITORY/ACTOR variable syntax

f50dff2

fix(scripts/upsertPullRequestComment): better types

f01184d

williaster commented Feb 5, 2021

View reviewed changes

fix(workflows/push/gallery): try to fix credentials

ff77c3e

williaster force-pushed the chris--moar-ci branch from f01e9be to ff77c3e Compare February 5, 2021 21:37

fix(github/workflows/push): try https for gallery push

6cb73a3

williaster force-pushed the chris--moar-ci branch from 12249ae to 6cb73a3 Compare February 5, 2021 21:55

fix(workflows/push): tweak https syntax

2fdee13

williaster force-pushed the chris--moar-ci branch from 04268a6 to 2fdee13 Compare February 5, 2021 22:25

fix(workflows/push): try github-pages-deploy-action

521b296

williaster force-pushed the chris--moar-ci branch from c00e947 to 521b296 Compare February 5, 2021 22:54

williaster added 3 commits February 5, 2021 15:06

fix(workflows/push): don't use working-directory with uses

72b182c

fix(workflows/push): try changing persist-credentials mid-workflow

82bfeab

fix(workflows/push): more changes

ff3a7b7

williaster force-pushed the chris--moar-ci branch from 04fcf5f to ff3a7b7 Compare February 5, 2021 23:35

williaster added 8 commits February 5, 2021 17:16

fix(workflows/push): try worktree approach

6e71972

fix(workflows/push): build gallery on master

ed6c6bf

fix(workflows/push): add out/ contents pre-commit

b6734d3

fix(workflows/push): fix credentials

16eac02

fix(workflows/push): try not master

3bed467

fix(workflows/push): try not master take 2

ddd77a9

fix(workflows/push): we have a winner

da1b374

fix(workflows/push,pull_request): final final

1bc79d1

fix(workflows/push): match 📡 emoji across workflows 🙄

d503be5

type(scripts/upsertPullRequestComment): fix types

160db5c

kristw approved these changes Feb 9, 2021

View reviewed changes

williaster merged commit 3d8a245 into master Feb 9, 2021

williaster deleted the chris--moar-ci branch February 9, 2021 20:14

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

github(workflows): add package size checks, add auto demo deploy #1048

github(workflows): add package size checks, add auto demo deploy #1048

williaster commented Feb 5, 2021 •

edited

Loading

coveralls commented Feb 5, 2021 •

edited

Loading

williaster Feb 5, 2021

williaster Feb 5, 2021

williaster commented Feb 9, 2021

kristw commented Feb 9, 2021 •

edited

Loading

github-actions bot commented Feb 9, 2021

Previous (master)

Current

williaster commented Feb 9, 2021

kristw Feb 9, 2021

williaster Feb 9, 2021

github(workflows): add package size checks, add auto demo deploy #1048

github(workflows): add package size checks, add auto demo deploy #1048

Conversation

williaster commented Feb 5, 2021 • edited Loading

🏠 Internal

coveralls commented Feb 5, 2021 • edited Loading

Pull Request Test Coverage Report for Build 541442101

Warning: This coverage report may be inaccurate.

Details

💛 - Coveralls

williaster Feb 5, 2021

Choose a reason for hiding this comment

williaster Feb 5, 2021

Choose a reason for hiding this comment

williaster commented Feb 9, 2021

kristw commented Feb 9, 2021 • edited Loading

github-actions bot commented Feb 9, 2021

Size Changes

Previous (master)

Current

williaster commented Feb 9, 2021

kristw Feb 9, 2021

Choose a reason for hiding this comment

williaster Feb 9, 2021

Choose a reason for hiding this comment

williaster commented Feb 5, 2021 •

edited

Loading

coveralls commented Feb 5, 2021 •

edited

Loading

kristw commented Feb 9, 2021 •

edited

Loading