feat: backstage v20

.eslintignore

@@ -0,0 +1 @@
+playwright.config.ts

.gitignore

@@ -49,3 +49,6 @@ site
 
 # vscode database functionality support files
 *.session.sql
+
+# E2E test reports
+e2e-test-report/

Dockerfile

@@ -1,6 +1,6 @@
 # https://backstage.io/docs/deployment/docker/#multi-stage-build
 # Stage 1 - Create yarn install skeleton layer
-FROM node:16-bullseye-slim AS packages
+FROM node:18-bookworm-slim AS packages
 
 WORKDIR /app
 COPY package.json yarn.lock ./
@@ -13,7 +13,7 @@ COPY plugins plugins
 RUN find packages \! -name "package.json" -mindepth 2 -maxdepth 2 -exec rm -rf {} \+
 
 # Stage 2 - Install dependencies and build packages
-FROM node:16-bullseye-slim AS build
+FROM node:18-bookworm-slim AS build
 
 # Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
 RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
@@ -26,15 +26,14 @@ RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
 # in which case you should also move better-sqlite3 to "devDependencies" in package.json.
 RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
     --mount=type=cache,target=/var/lib/apt,sharing=locked \
+    apt-get update && \
     apt-get install -y --no-install-recommends libsqlite3-dev
 
 USER node
 WORKDIR /app
 
 COPY --from=packages --chown=node:node /app .
 
-# Stop cypress from downloading it's massive binary.
-ENV CYPRESS_INSTALL_BINARY=0
 RUN --mount=type=cache,target=/home/node/.cache/yarn,sharing=locked,uid=1000,gid=1000 \
     yarn install --frozen-lockfile --network-timeout 600000
 
@@ -50,14 +49,20 @@ RUN mkdir packages/backend/dist/skeleton packages/backend/dist/bundle \
     && tar xzf packages/backend/dist/bundle.tar.gz -C packages/backend/dist/bundle
 
 # Stage 3 - Build the actual backend image and install production dependencies
-FROM node:16-bullseye-slim
+FROM node:18-bookworm-slim
 
 # Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
+# Additionally, we install dependencies for `techdocs.generator.runIn: local`.
+# https://backstage.io/docs/features/techdocs/getting-started#disabling-docker-in-docker-situation-optional
+ENV VIRTUAL_ENV=/opt/venv
+ENV PATH="$VIRTUAL_ENV/bin:$PATH"
 RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
     --mount=type=cache,target=/var/lib/apt,sharing=locked \
     apt-get update && \
-    apt-get install -y --no-install-recommends python3 g++ build-essential && \
-    yarn config set python /usr/bin/python3
+    apt-get install -y --no-install-recommends python3 python3-pip python3-venv g++ build-essential && \
+    yarn config set python /usr/bin/python3 && \
+    python3 -m venv $VIRTUAL_ENV && \
+    pip3 install mkdocs-techdocs-core==1.2.3
 
 # Install sqlite3 dependencies. You can skip this if you don't use sqlite3 in the image,
 # in which case you should also move better-sqlite3 to "devDependencies" in package.json.

backstage.json

@@ -1,3 +1,3 @@
 {
-  "version": "1.18.1"
+  "version": "1.20.3"
 }

lerna.json

@@ -1,6 +1,6 @@
 {
   "packages": ["packages/*", "plugins/*"],
   "npmClient": "yarn",
-  "useWorkspaces": true,
-  "version": "0.1.0"
+  "version": "0.1.0",
+  "$schema": "node_modules/lerna/schemas/lerna-schema.json"
 }

package.json

@@ -3,7 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "engines": {
-    "node": "16 || 18"
+    "node": "18 || 20"
   },
   "scripts": {
     "dev": "concurrently \"yarn start\" \"yarn start-backend\"",
@@ -30,10 +30,12 @@
     ]
   },
   "devDependencies": {
-    "@backstage/cli": "^0.22.13",
+    "@backstage/cli": "^0.24.0",
+    "@backstage/e2e-test-utils": "^0.1.0",
+    "@playwright/test": "^1.32.3",
     "@spotify/prettier-config": "^12.0.0",
     "concurrently": "^6.0.0",
-    "lerna": "^4.0.0",
+    "lerna": "^7.3.0",
     "node-gyp": "^9.0.0",
     "prettier": "^2.3.2",
     "typescript": "~5.2.0"
@@ -51,5 +53,8 @@
     "*.{json,md}": [
       "prettier --write"
     ]
+  },
+  "dependencies": {
+    "@types/react": "^17"
   }
 }

packages/app/e2e-tests/app.test.ts

@@ -0,0 +1,21 @@
+/*
+ * Copyright 2020 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { test, expect } from '@playwright/test';
+
+test('App should render the welcome page', async ({ page }) => {
+  await page.goto('/');
+  await expect(page.getByText('My Company Catalog')).toBeVisible();
+});

packages/app/package.json

@@ -11,43 +11,39 @@
     "build": "backstage-cli package build",
     "clean": "backstage-cli package clean",
     "test": "backstage-cli package test",
-    "lint": "backstage-cli package lint",
-    "test:e2e": "cross-env PORT=3001 start-server-and-test start http://localhost:3001 cy:dev",
-    "test:e2e:ci": "cross-env PORT=3001 start-server-and-test start http://localhost:3001 cy:run",
-    "cy:dev": "cypress open",
-    "cy:run": "cypress run --browser chrome"
+    "lint": "backstage-cli package lint"
   },
   "dependencies": {
-    "@backstage/app-defaults": "^1.4.3",
-    "@backstage/catalog-model": "^1.4.2",
-    "@backstage/cli": "^0.22.13",
-    "@backstage/core-app-api": "^1.10.0",
-    "@backstage/core-components": "^0.13.5",
-    "@backstage/core-plugin-api": "^1.6.0",
-    "@backstage/integration-react": "^1.1.19",
-    "@backstage/plugin-api-docs": "^0.9.11",
-    "@backstage/plugin-catalog": "^1.13.0",
-    "@backstage/plugin-catalog-common": "^1.0.16",
-    "@backstage/plugin-catalog-graph": "^0.2.36",
-    "@backstage/plugin-catalog-import": "^0.10.0",
-    "@backstage/plugin-catalog-react": "^1.8.4",
-    "@backstage/plugin-github-actions": "^0.6.5",
-    "@backstage/plugin-org": "^0.6.14",
-    "@backstage/plugin-permission-react": "^0.4.15",
-    "@backstage/plugin-scaffolder": "^1.15.0",
-    "@backstage/plugin-scaffolder-react": "^1.5.5",
-    "@backstage/plugin-search": "^1.4.0",
-    "@backstage/plugin-search-react": "^1.7.0",
-    "@backstage/plugin-tech-radar": "^0.6.8",
-    "@backstage/plugin-techdocs": "^1.7.0",
-    "@backstage/plugin-techdocs-module-addons-contrib": "^1.1.0",
-    "@backstage/plugin-techdocs-react": "^1.1.11",
-    "@backstage/plugin-user-settings": "^0.7.10",
-    "@backstage/theme": "^0.4.2",
-    "@frontside/backstage-plugin-humanitec": "^0.3.10",
+    "@backstage/app-defaults": "^1.4.5",
+    "@backstage/catalog-model": "^1.4.3",
+    "@backstage/cli": "^0.24.0",
+    "@backstage/core-app-api": "^1.11.1",
+    "@backstage/core-components": "^0.13.8",
+    "@backstage/core-plugin-api": "^1.8.0",
+    "@backstage/integration-react": "^1.1.21",
+    "@backstage/plugin-api-docs": "^0.10.1",
+    "@backstage/plugin-catalog": "^1.15.1",
+    "@backstage/plugin-catalog-common": "^1.0.18",
+    "@backstage/plugin-catalog-graph": "^0.3.1",
+    "@backstage/plugin-catalog-import": "^0.10.3",
+    "@backstage/plugin-catalog-react": "^1.9.1",
+    "@backstage/plugin-github-actions": "^0.6.8",
+    "@backstage/plugin-org": "^0.6.17",
+    "@backstage/plugin-permission-react": "^0.4.17",
+    "@backstage/plugin-scaffolder": "^1.16.1",
+    "@backstage/plugin-scaffolder-react": "^1.6.1",
+    "@backstage/plugin-search": "^1.4.3",
+    "@backstage/plugin-search-react": "^1.7.3",
+    "@backstage/plugin-tech-radar": "^0.6.10",
+    "@backstage/plugin-techdocs": "^1.9.1",
+    "@backstage/plugin-techdocs-module-addons-contrib": "^1.1.2",
+    "@backstage/plugin-techdocs-react": "^1.1.13",
+    "@backstage/plugin-user-settings": "^0.7.13",
+    "@backstage/theme": "^0.4.4",
+    "@frontside/backstage-plugin-humanitec": "^0.3.11",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
-    "@rjsf/core": "^5.10.0",
+    "@rjsf/utils": "^5.14.2",
     "history": "^5.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
@@ -56,16 +52,14 @@
     "react-use": "^17.2.4"
   },
   "devDependencies": {
-    "@backstage/test-utils": "^1.4.3",
+    "@backstage/test-utils": "^1.4.5",
+    "@playwright/test": "^1.32.3",
     "@testing-library/dom": "^8.0.0",
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^12.1.3",
     "@testing-library/user-event": "^14.0.0",
     "@types/react-dom": "*",
-    "cross-env": "^7.0.0",
-    "cypress": "^9.7.0",
-    "eslint-plugin-cypress": "^2.10.3",
-    "start-server-and-test": "^1.10.11"
+    "cross-env": "^7.0.0"
   },
   "browserslist": {
     "production": [

packages/app/public/index.html

@@ -8,7 +8,6 @@
       name="description"
       content="Backstage is an open platform for building developer portals"
     />
-    <link rel="apple-touch-icon" href="<%= publicPath %>/logo192.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/

packages/app/src/scaffolder/ValidateHumanitecAppID/ValidateHumanitecAppIDExtension.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FieldProps, FieldValidation } from '@rjsf/core';
+import { FieldProps, FieldValidation } from '@rjsf/utils';
 import FormControl from '@material-ui/core/FormControl';
 import { InputLabel, Input, FormHelperText, List, ListItem, Link } from '@material-ui/core';
 /*
@@ -15,7 +15,7 @@ export const ValidateHumanitecAppID = ({
     <FormControl
       margin="normal"
       required={required}
-      error={rawErrors?.length > 0 && !formData}
+      error={rawErrors && rawErrors?.length > 0 && !formData}
     >
       <InputLabel htmlFor="validateName">Name</InputLabel>
       <Input

packages/backend/Dockerfile

@@ -9,7 +9,7 @@
 #
 # Once the commands have been run, you can build the image using `yarn build-image`
 
-FROM node:16-bullseye-slim
+FROM node:18-bookworm-slim
 
 # Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
 RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \

packages/backend/package.json

@@ -16,36 +16,38 @@
     "build-image": "docker build ../.. -f Dockerfile --tag backstage"
   },
   "dependencies": {
-    "@backstage/backend-common": "^0.19.5",
-    "@backstage/backend-tasks": "^0.5.8",
-    "@backstage/catalog-client": "^1.4.4",
-    "@backstage/catalog-model": "^1.4.2",
-    "@backstage/config": "^1.1.0",
-    "@backstage/integration": "^1.7.0",
-    "@backstage/plugin-app-backend": "^0.3.51",
-    "@backstage/plugin-auth-backend": "^0.19.0",
-    "@backstage/plugin-auth-node": "^0.3.0",
-    "@backstage/plugin-catalog-backend": "^1.13.0",
-    "@backstage/plugin-permission-common": "^0.7.8",
-    "@backstage/plugin-permission-node": "^0.7.14",
-    "@backstage/plugin-proxy-backend": "^0.4.0",
-    "@backstage/plugin-scaffolder-backend": "^1.17.0",
-    "@backstage/plugin-search-backend": "^1.4.3",
-    "@backstage/plugin-search-backend-module-pg": "^0.5.12",
-    "@backstage/plugin-search-backend-node": "^1.2.7",
-    "@backstage/plugin-techdocs-backend": "^1.7.0",
-    "@frontside/backstage-plugin-humanitec-backend": "^0.3.10",
-    "@roadiehq/scaffolder-backend-module-aws": "^2.4.13",
+    "@backstage/backend-common": "^0.19.9",
+    "@backstage/backend-tasks": "^0.5.12",
+    "@backstage/catalog-client": "^1.4.6",
+    "@backstage/catalog-model": "^1.4.3",
+    "@backstage/config": "^1.1.1",
+    "@backstage/integration": "^1.7.2",
+    "@backstage/plugin-app-backend": "^0.3.55",
+    "@backstage/plugin-auth-backend": "^0.20.0",
+    "@backstage/plugin-auth-node": "^0.4.1",
+    "@backstage/plugin-catalog-backend": "^1.15.0",
+    "@backstage/plugin-catalog-backend-module-scaffolder-entity-model": "^0.1.4",
+    "@backstage/plugin-permission-common": "^0.7.10",
+    "@backstage/plugin-permission-node": "^0.7.18",
+    "@backstage/plugin-proxy-backend": "^0.4.5",
+    "@backstage/plugin-scaffolder-backend": "^1.19.1",
+    "@backstage/plugin-search-backend": "^1.4.7",
+    "@backstage/plugin-search-backend-module-pg": "^0.5.16",
+    "@backstage/plugin-search-backend-node": "^1.2.11",
+    "@backstage/plugin-techdocs-backend": "^1.9.0",
+    "@frontside/backstage-plugin-humanitec-backend": "^0.3.11",
+    "@roadiehq/scaffolder-backend-module-aws": "^2.4.16",
     "app": "link:../app",
-    "better-sqlite3": "^8.0.0",
+    "better-sqlite3": "^9.0.0",
     "dockerode": "^3.3.1",
     "express": "^4.17.1",
     "express-promise-router": "^4.1.0",
-    "pg": "^8.3.0",
+    "node-gyp": "^9.0.0",
+    "pg": "^8.11.3",
     "winston": "^3.2.1"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.22.13",
+    "@backstage/cli": "^0.24.0",
     "@types/dockerode": "^3.3.0",
     "@types/express": "^4.17.6",
     "@types/express-serve-static-core": "^4.17.5",

packages/backend/src/plugins/catalog.ts

@@ -1,5 +1,5 @@
 import { CatalogBuilder } from '@backstage/plugin-catalog-backend';
-import { ScaffolderEntitiesProcessor } from '@backstage/plugin-scaffolder-backend';
+import { ScaffolderEntitiesProcessor } from '@backstage/plugin-catalog-backend-module-scaffolder-entity-model';
 import { Router } from 'express';
 import { PluginEnvironment } from '../types';
 

packages/backend/src/plugins/search.ts

@@ -5,8 +5,8 @@ import {
   LunrSearchEngine,
 } from '@backstage/plugin-search-backend-node';
 import { PluginEnvironment } from '../types';
-import { DefaultCatalogCollatorFactory } from '@backstage/plugin-catalog-backend';
-import { DefaultTechDocsCollatorFactory } from '@backstage/plugin-techdocs-backend';
+import { DefaultCatalogCollatorFactory } from '@backstage/plugin-search-backend-module-catalog';
+import { DefaultTechDocsCollatorFactory } from '@backstage/plugin-search-backend-module-techdocs';
 import { Router } from 'express';
 
 export default async function createPlugin(