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.

Sign up for GitHub

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

Jump to bottom

Update to latest GB master #80

Merged
merged 1 commit into from
Jul 26, 2018
Merged

Update to latest GB master #80

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .babelrc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
"cwd": "babelrc",
"alias": {
"react-native-aztec": "./react-native-aztec",
"@wordpress/blocks": "./blocks",
"@wordpress/editor": "./editor",
"@gutenberg": "./gutenberg"
},
Expand Down
1 change: 1 addition & 0 deletions .flowconfig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ munge_underscores=true

module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
module.name_mapper='@gutenberg' -> '<PROJECT_ROOT>/gutenberg'
module.name_mapper='@wordpress/blocks' -> '<PROJECT_ROOT>/gutenberg/packages/blocks/src'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm actually not sure we should name this @wordpress as blocks are actually @gutenberg's. As a result of this observation we may also consider how other mappers are called, which I'm not sure of, but for Gutenberg blocks it sounds like it's definitely @gutenberg, wdyt?

Also, may I ask why do we set this here in Flow, and is not set in the module mapper plugin in .babelrc to indicate an alias? That's how I'd approached it, and would like to learn if that's a feasible path or not, and why this would be preferred, if the question first of all makes sense (i.e. can Flow be used for the same thing?)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm actually not sure we should name this @WordPress as blocks are actually @gutenberg's.

The package is actually called like that (see its package definition here) so, it makes sense to keep its original name.

why do we set this here in Flow, and is not set in the module mapper plugin in .babelrc to indicate an alias

It's not an alias as far as the build pipeline is concerned. For Metro, @wordpress/blocks is a normal package and tries its best to resolve it. Metro being the smart tool it is, it actually discovers the package automagically inside the gutenberg/packages folder.

We gradually have moved away from having to define aliases in Babel as the Gutenberg code has been npm-package-ized more and more. Previously, we had to "mock" those packages to mimic what Webpack is doing on the Gutenberg build side. But nowadays, the published Gutenberg packages can be easily picked up by Metro without alias tricks. Some packages (namely, the editor package` is still not published to NPM and that's why it's practically the only alias we have left in Babel.

But, Flow is not as smart as Metro. We need to give more direct instructions to Flow to go find the packages.

While on the subject, Jest (our testing tool) is also not as smart as Metro and that's why we have similar aliases in its jest.config.js file.

Copy link
Contributor

@mzorz mzorz Jul 26, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The package is actually called like that (see its package definition here) so, it makes sense to keep its original name.

👍 thanks for pointing to the original definition

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the detailed explanation about moving away from module resolver. I wonder why that wouldn't work then off the shelve for me (automagically as you say) when working on a similar PR in https://github.com/wordpress-mobile/gutenberg-mobile/tree/update/use-latest-gb-master

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While on the subject, Jest (our testing tool) is also not as smart as Metro and that's why we have similar aliases in its jest.config.js file

Thanks for pointing this out as well, brings useful insight

module.name_mapper='@wordpress/data' -> '<PROJECT_ROOT>/gutenberg/packages/data'
module.name_mapper='@wordpress/element' -> '<PROJECT_ROOT>/gutenberg/packages/element'
module.name_mapper='@wordpress/deprecated' -> '<PROJECT_ROOT>/gutenberg/packages/deprecated'
Expand Down
2 changes: 1 addition & 1 deletion gutenberg
Open in desktop
Submodule gutenberg updated 1024 files
4 changes: 2 additions & 2 deletions jest.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@ module.exports = {
'node',
],
moduleNameMapper: {
'@wordpress\\/(blocks|editor)$': '<rootDir>/gutenberg/$1',
'@wordpress\\/(data|element|deprecated)$': '<rootDir>/gutenberg/packages/$1/src/index',
'@wordpress\\/(editor)$': '<rootDir>/gutenberg/$1',
'@wordpress\\/(blocks|data|element|deprecated)$': '<rootDir>/gutenberg/packages/$1/src/index',
'@gutenberg': '<rootDir>/gutenberg',

// Mock the CSS modules. See https://facebook.github.io/jest/docs/en/webpack.html#handling-static-assets
Expand Down
2 changes: 2 additions & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
},
"devDependencies": {
"@wordpress/babel-preset-default": "^1.1.2",
"@wordpress/block-serialization-spec-parser": "^1.0.0",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I couldn't realize this was needed. May I ask, even if it's a trivial question, how you come to know this needs to be set as a dependency?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, that crops up when you try to run the tests actually. If you try without the dep you'll notice Jest complaining. Haven't investigated why it happens only on the testing pipeline though.

"babel-eslint": "^8.2.2",
"babel-plugin-react-native-classname-to-style": "^1.2.1",
"babel-plugin-react-native-platform-specific-extensions": "^1.0.1",
Expand Down Expand Up @@ -61,6 +62,7 @@
},
"dependencies": {
"@wordpress/autop": "^1.0.6",
"@wordpress/compose": "^1.0.1",
Copy link
Contributor

@mzorz mzorz Jul 26, 2018 •
edited by hypest
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why is this included as a dependency here, but then is denylisted here?

Copy link
Contributor Author

@hypest hypest Jul 26, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK, so, Metro being the smart tool it is, it actually tries to resolve the packages by looking in the local filesystem. So, when you do want to use the remote package from NPM you need to denylist the local package dir.

"@wordpress/deprecated": "^1.0.0-alpha.2",
"@wordpress/hooks": "^1.2.1",
"@wordpress/i18n": "^1.1.0",
Expand Down
2 changes: 1 addition & 1 deletion rn-cli.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ module.exports = {
// On the other hand, GB packages that are loaded from the source tree directly
// are automagically resolved by Metro so, there is no list of them anywhere.
return blacklist( [
/gutenberg\/packages\/(autop|deprecated|hooks|i18n|is-shallow-equal)\/.*/,
/gutenberg\/packages\/(autop|compose|deprecated|hooks|i18n|is-shallow-equal)\/.*/,
] );
},
getTransformModulePath() {
Expand Down
2 changes: 1 addition & 1 deletion src/block-management/block-holder.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import type { BlockType } from '../store/';
import styles from './block-holder.scss';

// Gutenberg imports
import { getBlockType } from '@gutenberg/blocks/api';
import { getBlockType } from '@wordpress/blocks';

type PropsType = BlockType & {
onChange: ( uid: string, attributes: mixed ) => void,
Expand Down
2 changes: 1 addition & 1 deletion src/block-management/block-manager.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import type { BlockType } from '../store/';
import styles from './block-manager.scss';

// Gutenberg imports
import { getBlockType, serialize } from '@gutenberg/blocks/api';
import { getBlockType, serialize } from '@wordpress/blocks';

export type BlockListType = {
onChange: ( uid: string, attributes: mixed ) => void,
Expand Down
5 changes: 5 additions & 0 deletions src/globals.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

import { createElement } from '@wordpress/element';
import jsdom from 'jsdom-jscore';
import jsdomLevel1Core from 'jsdom-jscore/lib/jsdom/level1/core';

global.wp = {
element: {
Expand All @@ -18,3 +19,7 @@ doc.implementation.createHTMLDocument = function( html ) {

// `hpq` depends on `document` be available globally
global.document = doc;

if ( ! global.window.Node ) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah! question, does defining this in this way fix the red screen I got saying undefined is not an object (evaluating '_window$Node.TEXT_NODE')?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes! So, turns out that recent Gutenberg changes exposed the need for those constants from window.Node that were previously handled from dom-react and our jsdom-core dep. But yeah, with the changes we apparently need to manually add the support.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

excellent, thanks for this clarification!

global.window.Node = jsdomLevel1Core.dom.level1.core.Node;
}
4 changes: 2 additions & 2 deletions src/parser/block-parser-code.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import '../globals';

import { registerCoreBlocks } from '@gutenberg/core-blocks';
import { parse } from '@gutenberg/blocks';
import { parse } from '@wordpress/blocks';

registerCoreBlocks();

Expand All @@ -14,7 +14,7 @@ describe( 'Parser', () => {
else:
return "Hello Pony"`;

const originalCodeBlockHtml = `<pre><code>${ codeContent }</code></pre>`;
const originalCodeBlockHtml = `<pre class="wp-block-code"><code>${ codeContent }</code></pre>`;

const gbCodeBlockHtml = `
<!-- wp:code -->
Expand Down
2 changes: 1 addition & 1 deletion src/parser/block-parser-more.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import '../globals';

import { registerCoreBlocks } from '@gutenberg/core-blocks';
import { parse } from '@gutenberg/blocks';
import { parse } from '@wordpress/blocks';

registerCoreBlocks();

Expand Down
4 changes: 2 additions & 2 deletions src/store/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@

// Gutenberg imports
import { registerCoreBlocks } from '@gutenberg/core-blocks';
import { parse } from '@gutenberg/blocks';
import { parse } from '@wordpress/blocks';

import { createStore } from 'redux';
import { reducer } from './reducers';
Expand All @@ -28,7 +28,7 @@ registerCoreBlocks();

const initialCodeBlockHtml = `
<!-- wp:code -->
<pre><code>if name == "World":
<pre class="wp-block-code"><code>if name == "World":
return "Hello World"
else:
return "Hello Pony"</code></pre>
Expand Down
39 changes: 36 additions & 3 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -536,16 +536,40 @@
babel-plugin-transform-runtime "^6.23.0"
babel-preset-env "^1.6.1"

"@wordpress/block-serialization-spec-parser@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@wordpress/block-serialization-spec-parser/-/block-serialization-spec-parser-1.0.0.tgz#a51a9276421629d4be398dfcc9bab52e303c3403"

"@wordpress/browserslist-config@^2.1.4":
version "2.2.0"
resolved "https://registry.yarnpkg.com/@wordpress/browserslist-config/-/browserslist-config-2.2.0.tgz#7fcc77db40d4d846dbb158e485a6badc143c76d2"

"@wordpress/deprecated@^1.0.0-alpha.2":
"@wordpress/compose@^1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@wordpress/compose/-/compose-1.0.1.tgz#fdfb24b27390ca97db432108c47188b4fc96dea8"
dependencies:
"@babel/runtime" "^7.0.0-beta.52"
"@wordpress/element" "^1.0.1"
"@wordpress/is-shallow-equal" "^1.1.1"
lodash "^4.17.10"

"@wordpress/deprecated@^1.0.0-alpha.2", "@wordpress/deprecated@^1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@wordpress/deprecated/-/deprecated-1.0.1.tgz#8769d791b228022caef156dbbff0f21eb2b21f3e"
dependencies:
"@babel/runtime" "^7.0.0-beta.52"

"@wordpress/element@^1.0.1":
version "1.0.1"
resolved "https://registry.yarnpkg.com/@wordpress/element/-/element-1.0.1.tgz#d9e31e437793655556816e6328bc67bfbecc4a27"
dependencies:
"@babel/runtime" "^7.0.0-beta.52"
"@wordpress/deprecated" "^1.0.1"
"@wordpress/is-shallow-equal" "^1.1.1"
lodash "^4.17.10"
react "^16.4.1"
react-dom "^16.4.1"

"@wordpress/hooks@^1.2.1":
version "1.3.1"
resolved "https://registry.yarnpkg.com/@wordpress/hooks/-/hooks-1.3.1.tgz#1ee50c777938060a96b202e22ca2e902eacce335"
Expand All @@ -562,7 +586,7 @@
lodash "^4.17.10"
memize "^1.0.5"

"@wordpress/is-shallow-equal@^1.0.1":
"@wordpress/is-shallow-equal@^1.0.1", "@wordpress/is-shallow-equal@^1.1.1":
version "1.1.1"
resolved "https://registry.yarnpkg.com/@wordpress/is-shallow-equal/-/is-shallow-equal-1.1.1.tgz#377db18206afe2a6e787862106c3ff5c27d65e36"
dependencies:
Expand Down Expand Up @@ -6208,7 +6232,7 @@ react-devtools-core@3.1.0:
shell-quote "^1.6.1"
ws "^2.0.3"

react-dom@^16.2.0:
react-dom@^16.2.0, react-dom@^16.4.1:
version "16.4.1"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.4.1.tgz#7f8b0223b3a5fbe205116c56deb85de32685dad6"
dependencies:
Expand Down Expand Up @@ -6369,6 +6393,15 @@ react@^0.14.0:
envify "^3.0.0"
fbjs "^0.6.1"

react@^16.4.1:
version "16.4.1"
resolved "https://registry.yarnpkg.com/react/-/react-16.4.1.tgz#de51ba5764b5dbcd1f9079037b862bd26b82fe32"
dependencies:
fbjs "^0.8.16"
loose-envify "^1.1.0"
object-assign "^4.1.1"
prop-types "^15.6.0"

read-pkg-up@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-1.0.1.tgz#9d63c13276c065918d57f002a57f40a1b643fb02"
Expand Down