Move composite-checkout-wpcom into client/lib

[nbloomf]

Changes proposed in this Pull Request

Moving this package into calypso so we get hot reloading during development. It may or may not make sense to move some of this out of calypso later, particularly the parts that are tightly bound to the billing backend.

This also sets the Jest test environment locally to ensure we use jsdom, per the unit testing readme.

[matticbot]

Test live: https://calypso.live/?branch=move/composite-checkout-to-calypso

[sirbrillig]

This test is failing because composite-checkout uses @wordpress/data which uses @wordpress/priority-queue which does not test for the existence of the window object before using it (eg: typeof window === undefined) and therefore will only work in a context where the window object exists. That object is part of the Web API, so it's only present in browsers, and presumably whatever test runner is being used to launch this test suite is running the javascript without a browser environment (unlike the test runner we're using in composite-checkout which uses jsdom).

So there are a few things we could try. The first thing IMO would be to look into the source code for @wordpress/priority-queue and submit a PR that tests for window before using it. On the other hand, it might be better or easier to see how the tests added (moved) in this PR are being run and modify the runner to use react-testing-library instead.

[sirbrillig]

The demo webpack config still references /packages/, so the demo does not work.

[sirbrillig]

Is it necessary to have a webpack config apart from the demo? Is it used? How about the TS config? I'm not really sure how this directory gets used as a library. We can probably remove the package.json too, right? Unless maybe we do need it... Do we need an index.js?

[sirbrillig]

🤔 My suggestion is to remove the demo entirely, since we can use the actual page in Calypso for that purpose. That simplifies the lib a fair amount by removing the need for any webpack config, package.json, typescript config, demo directory, and (I think) jest config.

[blowery]

I think we can get hot-reloading working without moving the package if that helps... We just need to add a watcher for packages/** and have it run npm run build-packages when it sees a change. Once the rebuild happens, webpack's watcher should pick it up and redo the webpack piece.

[blowery]

on the window checks, you might find WordPress/gutenberg#16227 of use or interesting. Need to finish pushing that forward.

[nbloomf]

will only work in a context where the window object exists.

Just to close the loop on this, issue #22637 is about this very problem, and links to the resolution in the test docs; it's possible to set the test environment (node by default, which doesn't have window) on a per-file basis.

[nbloomf]

This has been rendered obsolete by #37802.