Improve the build scripts

CONTRIBUTING.md

@@ -13,7 +13,7 @@ To test the plugin, or to contribute to it, you can clone this repository and bu
 First, you need a WordPress Environment to run the plugin on. The quickest way to get up and running is to use the provided docker setup. Just install [docker](https://www.docker.com/) on your machine and run `./bin/setup-local-env.sh`.
 
 The WordPress installation should be available at `http://localhost:8888` (username: `admin`, password: `password`).
-Inside the "docker" directory, you can use any docker command to interact with your containers.
+Inside the "docker" directory, you can use any docker command to interact with your containers. If this port is in use, you can override it in your `docker-compose.override.yml` file. If you're running [e2e tests](https://wordpress.org/gutenberg/handbook/reference/testing-overview/#end-to-end-testing), this change will be used correctly.
 
 Alternatively, you can use your own local WordPress environment and clone this repository right into your `wp-content/plugins` directory.
 

bin/includes.sh

@@ -0,0 +1,107 @@
+#!/bin/bash
+
+##
+# Ask a Yes/No question, and way for a reply.
+#
+# This is a general-purpose function to ask Yes/No questions in Bash, either with or without a default
+# answer. It keeps repeating the question until it gets a valid answer.
+#
+# @param {string} prompt    The question to ask the user.
+# @param {string} [default] Optional. "Y" or "N", for the default option to use if none is entered.
+#
+# @returns {bool} true if the user replies Yes, false if the user replies No.
+##
+ask() {
+    # Source: https://djm.me/ask
+    local prompt default reply
+
+    while true; do
+
+        if [ "${2:-}" = "Y" ]; then
+            prompt="Y/n"
+            default=Y
+        elif [ "${2:-}" = "N" ]; then
+            prompt="y/N"
+            default=N
+        else
+            prompt="y/n"
+            default=
+        fi
+
+        # Ask the question (not using "read -p" as it uses stderr not stdout)
+        echo -en "$1 [$prompt] "
+
+        # Read the answer (use /dev/tty in case stdin is redirected from somewhere else)
+        read reply </dev/tty
+
+        # Default?
+        if [ -z "$reply" ]; then
+            reply=$default
+        fi
+
+        # Check if the reply is valid
+        case "$reply" in
+            Y*|y*) return 0 ;;
+            N*|n*) return 1 ;;
+        esac
+
+    done
+}
+
+##
+# Download from a remote source.
+#
+# Checks for the existence of curl and wget, then downloads the remote file using the first available option.
+#
+# @param {string} remote  The remote file to download.
+# @param {string} [local] Optional. The local filename to use. If it isn't passed, STDOUT is used.
+#
+# @return {bool} Whether the download succeeded or not.
+##
+download() {
+    if command_exists "curl"; then
+        curl -s -o "${2:--}" "$1"
+    elif command_exists "wget"; then
+		wget -nv -O "${2:--}" "$1"
+    fi
+}
+
+##
+# Add error message formatting to a string, and echo it.
+#
+# @param {string} message The string to add formatting to.
+##
+error_message() {
+	echo -en "\033[31mERROR\033[0m: $1"
+}
+
+##
+# Add warning message formatting to a string, and echo it.
+#
+# @param {string} message The string to add formatting to.
+##
+warning_message() {
+	echo -en "\033[33mWARNING\033[0m: $1"
+}
+
+##
+# Add status message formatting to a string, and echo it.
+#
+# @param {string} message The string to add formatting to.
+##
+status_message() {
+	echo -en "\033[32mSTATUS\033[0m: $1"
+}
+
+##
+# Check if the command exists as some sort of executable.
+#
+# The executable form of the command could be an alias, function, builtin, executable file or shell keyword.
+#
+# @param {string} command The command to check.
+#
+# @return {bool} Whether the command exists or not.
+##
+command_exists() {
+	type -t "$1" >/dev/null 2>&1
+}

bin/install-docker.sh

@@ -0,0 +1,63 @@
+#!/bin/bash
+
+# Exit if any command fails
+set -e
+
+# Include useful functions
+. "$(dirname "$0")/includes.sh"
+
+# Check that Docker is installed
+if ! command_exists "docker"; then
+	echo -e $(error_message "Docker doesn't seem to be installed. Please head on over to the Docker site to download it: https://www.docker.com/community-edition#/download" )
+	exit 1
+fi
+
+# Check that Docker is running
+if ! docker info >/dev/null 2>&1; then
+	echo -e $(error_message "Docker isn't running. Please check that you've started your Docker app, and see it in your system tray.")
+	exit 1
+fi
+
+# Launch the containers
+echo -e $(status_message "Updating and starting Docker containers...")
+if ! docker-compose up -d; then
+	# Launching may fail due to the docker config file directory having changed.
+	# Remove the old wordpress-dev container, and try again.
+	docker container rm -fv wordpress-dev
+	docker-compose up -d
+fi
+
+HOST_PORT=$(docker inspect --format '{{(index (index .HostConfig.PortBindings "80/tcp") 0).HostPort}}' wordpress-dev)
+
+# Wait until the docker containers are setup properely
+echo -en $(status_message "Attempting to connect to wordpress...")
+until $(curl -L http://localhost:$HOST_PORT -so - 2>&1 | grep -q "WordPress"); do
+    echo -n '.'
+    sleep 5
+done
+echo ' done!'
+
+# Install WordPress
+echo -en $(status_message "Installing WordPress...")
+docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli core install --url=localhost:$HOST_PORT --title=Gutenberg --admin_user=admin --admin_password=password [email protected] >/dev/null
+
+CURRENT_URL=$(docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli option get siteurl)
+if [ "$CURRENT_URL" != "http://localhost:$HOST_PORT" ]; then
+	docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli option update home "http://localhost:$HOST_PORT"
+	docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli option update siteurl "http://localhost:$HOST_PORT"
+fi
+echo ' done!'
+
+# Activate Gutenberg
+echo -en $(status_message "Activating Gutenberg...")
+docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli plugin activate gutenberg >/dev/null
+echo ' done!'
+
+# Install the PHPUnit test scaffolding
+echo -en $(status_message "Installing PHPUnit test scaffolding...")
+docker-compose run --rm wordpress_phpunit /app/bin/install-wp-tests.sh wordpress_test root example mysql latest false >/dev/null
+echo ' done!'
+
+# Install Composer
+echo -e $(status_message "Installing and updating Composer modules...")
+docker-compose run --rm composer install

bin/install-node-nvm.sh

@@ -0,0 +1,85 @@
+#!/bin/bash
+NVM_VERSION="v0.33.8"
+
+# Exit if any command fails
+set -e
+
+# Include useful functions
+. "$(dirname "$0")/includes.sh"
+
+# Load NVM
+if [ -n "$NVM_DIR" ]; then
+	# The --no-use option ensures loading NVM doesn't switch the current version.
+	. "$NVM_DIR/nvm.sh" --no-use
+fi
+
+# Change to the expected directory
+cd "$(dirname "$0")/.."
+
+# Check if nvm is installed
+if [ "$TRAVIS" != "true" ] && ! command_exists "nvm"; then
+	if ask "$(error_message "NVM isn't installed, would you like to download and install it automatically?")" Y; then
+		# The .bash_profile file needs to exist for NVM to install
+		if [ ! -e ~/.bash_profile ]; then
+			touch ~/.bash_profile
+		fi
+
+		echo -en $(status_message "Installing NVM..." )
+		download "https://raw.githubusercontent.com/creationix/nvm/$NVM_VERSION/install.sh" | bash >/dev/null 2>&1
+		echo ' done!'
+
+		echo -e $(warning_message "NVM was updated, please run this command to reload it:" )
+		echo -e $(warning_message ". \$HOME/.nvm/nvm.sh" )
+		echo -e $(warning_message "After that, re-run the setup script to continue." )
+	else
+		echo -e $(error_message "Please install NVM manually, then re-run the setup script to continue. NVM installation instructions can be found here: https://github.com/creationix/nvm")
+	fi
+
+	exit 1
+fi
+
+if [ "$TRAVIS" != "true" ] && [ $NVM_VERSION != "v$(nvm --version)" ]; then
+	echo -en $(status_message "Updating NVM..." )
+	download "https://raw.githubusercontent.com/creationix/nvm/$NVM_VERSION/install.sh" | bash >/dev/null 2>&1
+	echo ' done!'
+
+	echo -e $(warning_message "NVM was updated, please run this command to reload it:" )
+	echo -e $(warning_message ". \$HOME/.nvm/nvm.sh" )
+	echo -e $(warning_message "After that, re-run the setup script to continue." )
+	exit 1
+fi
+
+# Check if the current node version is up to date.
+if [ "$TRAVIS" != "true" ] && [ "$(nvm current)" != "$(nvm version-remote --lts)" ]; then
+	echo -en $(status_message "Updating Node..." )
+	nvm install >/dev/null 2>&1
+	echo ' done!'
+
+	echo -e $(warning_message "A new node version was install, please run this command to use it:" )
+	echo -e $(warning_message "nvm use" )
+	echo -e $(warning_message "After that, re-run the setup script to continue." )
+	exit 1
+fi
+
+# Install/update packages
+echo -e $(status_message "Installing and updating NPM packages..." )
+npm install
+
+# There was a bug in NPM that caused has changes in package-lock.json. Handle that.
+if [ "$TRAVIS" != "true" ] && ! git diff --exit-code package-lock.json >/dev/null; then
+	if ask "$(warning_message "There's an issue with your NPM cache, would you like to try and automatically clean it up?" )" N; then
+		rm -rf node_modules/
+		npm cache clean --force >/dev/null 2>&1
+		git checkout package-lock.json
+
+		echo -e $(status_message "Reinstalling NPM packages..." )
+		npm install
+
+		# Check that it's cleaned up now.
+		if git diff --exit-code package-lock.json >/dev/null; then
+			echo -e $(warning_message "Confirmed that the NPM cache is cleaned up." )
+		else
+			echo -e $(error_message "We were unable to clean the NPM cache, please manually review the changes to package-lock.json. Continuing with the setup process..." )
+		fi
+	fi
+fi

bin/install-wp-tests.sh

@@ -1,5 +1,8 @@
 #!/usr/bin/env bash
 
+# Include useful functions
+. "$(dirname "$0")/includes.sh"
+
 if [ $# -lt 3 ]; then
 	echo "usage: $0 <db-name> <db-user> <db-pass> [db-host] [wp-version] [skip-database-creation]"
 	exit 1
@@ -15,14 +18,6 @@ SKIP_DB_CREATE=${6-false}
 WP_TESTS_DIR=${WP_TESTS_DIR-/tmp/wordpress-tests-lib}
 WP_CORE_DIR=${WP_CORE_DIR-/tmp/wordpress/}
 
-download() {
-    if [ `which curl` ]; then
-        curl -s "$1" > "$2";
-    elif [ `which wget` ]; then
-        wget -nv -O "$2" "$1"
-    fi
-}
-
 if [[ $WP_VERSION =~ [0-9]+\.[0-9]+(\.[0-9]+)? ]]; then
 	WP_TESTS_TAG="tags/$WP_VERSION"
 elif [[ $WP_VERSION == 'nightly' || $WP_VERSION == 'trunk' ]]; then

bin/run-wp-unit-tests.sh

@@ -8,11 +8,13 @@ if [ ${DOCKER} = "true" ]; then
 else
 	bash bin/install-wp-tests.sh wordpress_test root '' localhost $WP_VERSION
 	source bin/install-php-phpunit.sh
+
+	# Run the build because otherwise there will be a bunch of warnings about
+	# failed `stat` calls from `filemtime()`.
+	composer install || exit 1
+	npm install || exit 1
 fi
-# Run the build because otherwise there will be a bunch of warnings about
-# failed `stat` calls from `filemtime()`.
-composer install || exit 1
-npm install || exit 1
+
 npm run build || exit 1
 
 # Make sure phpegjs parser is up to date

bin/setup-local-env.sh

@@ -6,26 +6,8 @@ set -e
 # Change to the expected directory
 cd "$(dirname "$0")/.."
 
-# Launch the containers
-if ! docker-compose up -d; then
-	# Launching may fail due to the docker config file directory having changed.
-	# Remove the old wordpress-dev container, and try again.
-	docker container rm -fv wordpress-dev
-	docker-compose up -d
-fi
+# Check Node and NVM are installed
+. "$(dirname "$0")/install-node-nvm.sh"
 
-# Wait until the docker containers are setup properely
-echo "Attempting to connect to wordpress"
-until $(curl -L http://localhost:8888 -so - | grep -q "WordPress"); do
-    printf '.'
-    sleep 5
-done
-
-# Install WordPress
-docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli core install --url=localhost:8888 --title=Gutenberg --admin_user=admin --admin_password=password [email protected]
-
-# Activate Gutenberg
-docker run -it --rm --volumes-from wordpress-dev --network container:wordpress-dev wordpress:cli plugin activate gutenberg
-
-# Install the PHPUnit test scaffolding
-docker-compose run --rm wordpress_phpunit /app/bin/install-wp-tests.sh wordpress_test root example mysql latest false
+# Check Docker is installed and running
+. "$(dirname "$0")/install-docker.sh"

composer.json

@@ -18,5 +18,8 @@
 	},
 	"require": {
 		"composer/installers": "~1.0"
+	},
+	"scripts": {
+		"lint": "phpcs"
 	}
 }

cypress.json

@@ -7,5 +7,6 @@
 	"integrationFolder": "test/e2e/integration",
 	"supportFile": "test/e2e/support",
 	"videoRecording": false,
-	"chromeWebSecurity": false
+	"chromeWebSecurity": false,
+	"pluginsFile": "test/e2e/plugins"
 }

docker-compose.yml

@@ -27,5 +27,10 @@ services:
       - .:/app
       - testsuite:/tmp
 
+  composer:
+    image: composer
+    volumes:
+      - .:/app
+
 volumes:
   testsuite: {}

docs/coding-guidelines.md

@@ -91,6 +91,6 @@ import VisualEditor from '../visual-editor';
 We use
 [`phpcs` (PHP\_CodeSniffer)](https://github.com/squizlabs/PHP_CodeSniffer) with the [WordPress Coding Standards ruleset](https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards) to run a lot of automated checks against all PHP code in this project.  This ensures that we are consistent with WordPress PHP coding standards.
 
-When making any changes to the PHP code in this project, it's recommended to install and run `phpcs` on your computer.  This is a step in our Travis CI build as well, but it is better to catch errors locally.
+The easiest way to use PHPCS is [local environment](https://github.com/WordPress/gutenberg/blob/master/CONTRIBUTING.md#local-environment). Once that's installed, you can check your PHP by running `npm run lint-php`.
 
-The easiest way to do this is using `composer`. [Install `composer`](https://getcomposer.org/download/) on your computer, then run `composer install`.  This will install `phpcs` and `WordPress-Coding-Standards` which you can the run via `vendor/bin/phpcs`.
+If you prefer to install PHPCS locally, you should use `composer`. [Install `composer`](https://getcomposer.org/download/) on your computer, then run `composer install`.  This will install `phpcs` and `WordPress-Coding-Standards` which you can the run via `vendor/bin/phpcs`.