From 2654756a03a886a6f3c751b53355a6f9527a45cf Mon Sep 17 00:00:00 2001 From: Helen Hou-Sandi Date: Fri, 10 Feb 2023 02:59:04 +0000 Subject: [PATCH] Build/Test Tools: Add a devcontainer for Codespaces support. This adds a devcontainer configuration tested for use with GitHub Codespaces. It is currently built on top of the Docker `wordpress` image for initial trial purposes. We should eventually be using our own containers to fully own the environment. This should be considered a beta run to get a sense of how well cloud dev containers work for core contributors, in particular at contributor day events with limited bandwidth and mobile devices. Props samruddhikhandale, dinhtungdu, helen, craiglpeters, sam1el, wirecat. See #57187. git-svn-id: https://develop.svn.wordpress.org/trunk@55303 602fd350-edb4-49c9-b593-d223f7449a82 --- .devcontainer/devcontainer.json | 25 +++++++++++++++++++++++++ .devcontainer/docker-compose.yml | 30 ++++++++++++++++++++++++++++++ .devcontainer/install-tools.sh | 11 +++++++++++ .devcontainer/setup.sh | 18 ++++++++++++++++++ .devcontainer/welcome-message.txt | 6 ++++++ .gitignore | 1 + README.md | 18 ++++++++++++++++++ 7 files changed, 109 insertions(+) create mode 100644 .devcontainer/devcontainer.json create mode 100644 .devcontainer/docker-compose.yml create mode 100644 .devcontainer/install-tools.sh create mode 100644 .devcontainer/setup.sh create mode 100644 .devcontainer/welcome-message.txt diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json new file mode 100644 index 0000000000..36211b66fb --- /dev/null +++ b/.devcontainer/devcontainer.json @@ -0,0 +1,25 @@ +// For format details, see https://aka.ms/devcontainer.json. +{ + "name": "WordPress Core Development", + "dockerComposeFile": "docker-compose.yml", + "service": "wordpress", + "workspaceFolder": "/workspaces/${localWorkspaceFolderBasename}", + + // Features to add to the dev container. More info: https://containers.dev/features. + "features": { + "ghcr.io/devcontainers/features/common-utils:2": { + "username": "wordpress" + }, + "ghcr.io/devcontainers/features/node:1": { + "version": "14" + }, + "ghcr.io/devcontainers/features/docker-in-docker:2": {}, + "ghcr.io/devcontainers/features/git:1": {} + }, + "onCreateCommand": "sudo chmod +x .devcontainer/install-tools.sh && .devcontainer/install-tools.sh", + "postCreateCommand": "sudo chmod +x .devcontainer/setup.sh && .devcontainer/setup.sh", + "forwardPorts": [ + 8080 + ], + "remoteUser": "wordpress" +} diff --git a/.devcontainer/docker-compose.yml b/.devcontainer/docker-compose.yml new file mode 100644 index 0000000000..8a2b0a11f9 --- /dev/null +++ b/.devcontainer/docker-compose.yml @@ -0,0 +1,30 @@ +version: '3.1' + +services: + wordpress: + image: wordpress + restart: always + ports: + - 8080:80 + environment: + WORDPRESS_DB_HOST: db + WORDPRESS_DB_USER: exampleuser + WORDPRESS_DB_PASSWORD: examplepass + WORDPRESS_DB_NAME: exampledb + volumes: + - ../src:/var/www/html + + db: + image: mariadb + restart: always + environment: + MYSQL_DATABASE: exampledb + MYSQL_USER: exampleuser + MYSQL_PASSWORD: examplepass + MYSQL_RANDOM_ROOT_PASSWORD: '1' + volumes: + - db:/var/lib/mysql + +volumes: + wordpress: + db: diff --git a/.devcontainer/install-tools.sh b/.devcontainer/install-tools.sh new file mode 100644 index 0000000000..2347045502 --- /dev/null +++ b/.devcontainer/install-tools.sh @@ -0,0 +1,11 @@ +#!/bin/sh + +set -eux + +echo "Installing wp-cli..." +curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar +sudo chmod +x wp-cli.phar +sudo mv wp-cli.phar /usr/local/bin/wp + +# Copy the welcome message +sudo cp .devcontainer/welcome-message.txt /usr/local/etc/vscode-dev-containers/first-run-notice.txt diff --git a/.devcontainer/setup.sh b/.devcontainer/setup.sh new file mode 100644 index 0000000000..7e38c008f3 --- /dev/null +++ b/.devcontainer/setup.sh @@ -0,0 +1,18 @@ +#!/bin/sh + +set -eux + +if [ "${CODESPACE_NAME}" = "" ]; then + SITE_HOST="http://localhost:8080" +else + SITE_HOST="https://${CODESPACE_NAME}-8080.${GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN}" +fi + +# Install dependencies +cd /workspaces/wordpress-develop +npm install && npm run build:dev + +# Install WordPress and activate the plugin/theme. +cd /var/www/html +echo "Setting up WordPress at $SITE_HOST" +wp core install --url="$SITE_HOST" --title="WordPress Trunk" --admin_user="admin" --admin_email="admin@example.com" --admin_password="password" --skip-email diff --git a/.devcontainer/welcome-message.txt b/.devcontainer/welcome-message.txt new file mode 100644 index 0000000000..cedaa756fa --- /dev/null +++ b/.devcontainer/welcome-message.txt @@ -0,0 +1,6 @@ +👋 Welcome to "WordPress Core Development" in Codespaces! + +🛠️ Your environment is fully setup with all the required software. + +🚀 To get started, wait for the "postCreateCommand" to finish setting things up, then open the portforwarded URL and append '/wp-admin'. + diff --git a/.gitignore b/.gitignore index bf174880a3..2a08b9f1d7 100644 --- a/.gitignore +++ b/.gitignore @@ -38,6 +38,7 @@ wp-tests-config.php /src/wp-includes/blocks/**/*.js.map /packagehash.txt /artifacts +/setup.log # Files and folders that get created in wp-content /src/wp-content/blogs.dir diff --git a/README.md b/README.md index be8aa75404..ff47d75461 100644 --- a/README.md +++ b/README.md @@ -7,6 +7,22 @@ Welcome to the WordPress development repository! Please check out the [contribut ## Getting Started +### Using GitHub Codespaces + +To get started, create a codespace for this repository by clicking this 👇 + +[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://github.com/codespaces/new?hide_repo_select=true&ref=trunk&repo=75645659) + +A codespace will open in a web-based version of Visual Studio Code. The [dev container](.devcontainer/devcontainer.json) is fully configured with softwares needed for this project. + +**Note**: Dev containers is an open spec which is supported by [GitHub Codespaces](https://github.com/codespaces) and [other tools](https://containers.dev/supporting). + +In some browsers the keyboard shortcut for opening the command palette (Ctrl/Command + Shift + P) may collide with a browser shortcut. The command palette can be opened via the `F1` key or via the cog icon in the bottom left of the editor. + +When opening your codespace, be sure to wait for the `postCreateCommand` to finish running to ensure your WordPress install is successfully set up. This can take a few minutes. + +### Local development + WordPress is a PHP, MySQL, and JavaScript based project, and uses Node for its JavaScript dependencies. A local development environment is available to quickly get up and running. You will need a basic understanding of how to use the command line on your computer. This will allow you to set up the local development environment, to start it and stop it when necessary, and to run the tests. @@ -108,6 +124,8 @@ To login to the site, navigate to http://localhost:8889/wp-admin. * Username: `admin` * Password: `password` +**Note:** With Codespaces, open the portforwarded URL from the ports tab in the terminal, and append `/wp-admin` to login to the site. + To generate a new password (recommended): 1. Go to the Dashboard