Merge pull request #1256 from radanskoric/fix-devcontainer

Fix devcontainer configuration

.devcontainer/Dockerfile

@@ -1,36 +1,5 @@
-# See here for image contents: https://github.com/microsoft/vscode-dev-containers/tree/v0.191.1/containers/typescript-node/.devcontainer/base.Dockerfile
+# See comments in devcontainer.json for details of setting the playwright tag.
+ARG PLAYWRIGHT_TAG="v1.30.0-focal"
+FROM mcr.microsoft.com/playwright:${PLAYWRIGHT_TAG}
 
-# [Choice] Node.js version: 16, 14, 12
-ARG VARIANT="16-buster"
-FROM mcr.microsoft.com/vscode/devcontainers/typescript-node:0-${VARIANT}
-
-# [Optional] Uncomment this section to install additional OS packages.
-RUN apt-get update \
-    && export DEBIAN_FRONTEND=noninteractive \
-    && apt-get -y install --no-install-recommends \
-        openjdk-11-jdk \
-        firefox-esr
-
-# Chromium and chrome-driver
-ARG CHROMIUM_DEB_URL=https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
-RUN wget -qO - $CHROMIUM_DEB_URL > /tmp/chrome_linux64.deb \
-    && apt -y install /tmp/chrome_linux64.deb -f \
-    && FULL_CHROME_VERSION=$(google-chrome --product-version) \
-    && CHROME_VERSION=${FULL_CHROME_VERSION%.*} \
-    && CHROMEDRIVER_DIR="/usr/local/share/chrome_driver" \
-    && CHROMEDRIVER_BIN="$CHROMEDRIVER_DIR/chromedriver" \
-    && LATEST_CHROMEDRIVER_VERSION=$(curl -sL "https://chromedriver.storage.googleapis.com/LATEST_RELEASE_$CHROME_VERSION") \
-    && CHROMEDRIVER_URL="https://chromedriver.storage.googleapis.com/$LATEST_CHROMEDRIVER_VERSION/chromedriver_linux64.zip" \
-    && wget -qO - $CHROMEDRIVER_URL > /tmp/chromedriver_linux64.zip \
-    && mkdir -p $CHROMEDRIVER_DIR \
-    && unzip -qq /tmp/chromedriver_linux64.zip -d $CHROMEDRIVER_DIR \
-    && chmod +x $CHROMEDRIVER_BIN \
-    && ln -s "$CHROMEDRIVER_BIN" /usr/bin/ \
-    && rm -rf /tmp/chrome*
-
-# [Optional] Uncomment if you want to install an additional version of node using nvm
-# ARG EXTRA_NODE_VERSION=10
-# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
-
-# [Optional] Uncomment if you want to install more global node packages
-# RUN su node -c "npm install -g <your-package-list -here>"
+WORKDIR /app

.devcontainer/devcontainer.json

@@ -1,24 +1,28 @@
 // For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
 // https://github.com/microsoft/vscode-dev-containers/tree/v0.191.1/containers/typescript-node
 {
-  "name": "Node.js & TypeScript",
+  "name": "Node.js & Playwright",
   "build": {
     "dockerfile": "Dockerfile",
-    // Update 'VARIANT' to pick a Node version: 12, 14, 16
+    // Change to pick a different tag, see https://mcr.microsoft.com/en-us/product/playwright/tags
+    //
+    // IMPORTANT: The playwright image version must match @playwright/test version from package.json.
+    // Otherwise it will not work, the test version will look for the browser versions which it won't
+    // find on the image.
+    //
+    // pick '...-arm64' version if running on Apple Silicon.
     "args": {
-      "VARIANT": "16"
+      "PLAYWRIGHT_TAG": "v1.30.0-focal"
     }
   },
-  // Set *default* container specific settings.json values on container create.
-  "settings": {},
   // Add the IDs of extensions you want installed when the container is created.
-  "extensions": [
-    "dbaeumer.vscode-eslint"
-  ],
+  "customizations": {
+    "vscode": {
+      "extensions": ["dbaeumer.vscode-eslint"]
+    }
+  },
   // Use 'forwardPorts' to make a list of ports inside the container available locally.
-  // "forwardPorts": [],
+  "forwardPorts": [9000],
   // Use 'postCreateCommand' to run commands after the container is created.
-  "postCreateCommand": "yarn install && yarn build",
-  // Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
-  "remoteUser": "node"
+  "postCreateCommand": "yarn install && yarn build"
 }

package.json

@@ -34,7 +34,7 @@
   },
   "devDependencies": {
     "@open-wc/testing": "^3.1.7",
-    "@playwright/test": "^1.28.0",
+    "@playwright/test": "~1.30.0",
     "@rollup/plugin-node-resolve": "13.1.3",
     "@web/dev-server-esbuild": "^0.3.3",
     "@web/test-runner": "^0.15.0",

yarn.lock

@@ -177,13 +177,13 @@
     "@types/sinon-chai" "^3.2.3"
     chai-a11y-axe "^1.3.2"
 
-"@playwright/test@^1.28.0":
-  version "1.28.1"
-  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.28.1.tgz#e5be297e024a3256610cac2baaa9347fd57c7860"
-  integrity sha512-xN6spdqrNlwSn9KabIhqfZR7IWjPpFK1835tFNgjrlysaSezuX8PYUwaz38V/yI8TJLG9PkAMEXoHRXYXlpTPQ==
+"@playwright/test@~1.30.0":
+  version "1.30.0"
+  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.30.0.tgz#8c0c4930ff2c7be7b3ec3fd434b2a3b4465ed7cb"
+  integrity sha512-SVxkQw1xvn/Wk/EvBnqWIq6NLo1AppwbYOjNLmyU0R1RoQ3rLEBtmjTnElcnz8VEtn11fptj1ECxK0tgURhajw==
   dependencies:
     "@types/node" "*"
-    playwright-core "1.28.1"
+    playwright-core "1.30.0"
 
 "@rollup/[email protected]":
   version "13.1.3"
@@ -2534,11 +2534,6 @@ [email protected]:
   dependencies:
     find-up "^4.0.0"
 
-[email protected]:
-  version "1.28.1"
-  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.28.1.tgz#8400be9f4a8d1c0489abdb9e75a4cc0ffc3c00cb"
-  integrity sha512-3PixLnGPno0E8rSBJjtwqTwJe3Yw72QwBBBxNoukIj3lEeBNXwbNiKrNuB1oyQgTBw5QHUhNO3SteEtHaMK6ag==
-
 [email protected]:
   version "1.30.0"
   resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.30.0.tgz#de987cea2e86669e3b85732d230c277771873285"