Playwright suite on CI + me/todo/autocomplete specs

.github/workflows/playwright.yml

@@ -56,7 +56,7 @@ jobs:
         ports:
           - 9200:9200
       mattermost-server:
-        image: mattermost/mattermost-enterprise-edition:release-7.7
+        image: mattermost/mattermost-enterprise-edition:master
         env:
           DB_HOST: postgres
           DB_PORT_NUMBER: 5432
@@ -78,6 +78,7 @@ jobs:
           MM_SERVICESETTINGS_SITEURL: http://localhost:8065
           MM_PLUGINSETTINGS_AUTOMATICPREPACKAGEDPLUGINS: false
           MM_ANNOUNCEMENTSETTINGS_ADMINNOTICESENABLED: false
+          MM_SERVICESETTINGS_ENABLEONBOARDINGFLOW: false
           MM_FEATUREFLAGS_AppsEnabled: true
 
         ports:
@@ -126,6 +127,7 @@ jobs:
         run: make deploy
         env:
           PLUGIN_E2E_MOCK_OAUTH_SERVER_URL: http://172.17.0.1:8080
+          E2E_TESTING: true
 
       - name: ci/setup-node
         uses: actions/setup-node@64ed1c7eab4cce3362f8c340dee64e5eaeef8f7c # v3.6.0
@@ -139,6 +141,16 @@ jobs:
           cd e2e/playwright
           ./setup-environment
 
+      - name: ci/tsc
+        run: |
+          cd e2e/playwright
+          npm run tsc
+
+      - name: ci/lint
+        run: |
+          cd e2e/playwright
+          npm run lint
+
       - name: ci/run-playwright-tests
         run: |
           cd e2e/playwright
@@ -152,8 +164,6 @@ jobs:
         run: |
           cd e2e/playwright
           mkdir results
-
-          mv screenshots results
           mv playwright-report results
 
       - uses: actions/upload-artifact@v3

.gitignore

@@ -9,3 +9,5 @@ dist/
 
 # Jetbrains
 .idea/
+
+_debug

build/custom.mk

@@ -9,5 +9,8 @@ endif
 GO_BUILD_FLAGS += -ldflags '-X "github.com/mattermost/mattermost-plugin-api/experimental/telemetry.rudderWriteKey=$(RUDDER_WRITE_KEY)"'
 
 ifdef PLUGIN_E2E_MOCK_OAUTH_SERVER_URL
-GO_BUILD_FLAGS += -ldflags '-X "github.com/mattermost/mattermost-plugin-github/server/plugin.testOAuthServerURL=$(PLUGIN_E2E_MOCK_OAUTH_SERVER_URL)"'
+	GO_BUILD_FLAGS += -ldflags '-X "github.com/mattermost/mattermost-plugin-github/server/plugin.testOAuthServerURL=$(PLUGIN_E2E_MOCK_OAUTH_SERVER_URL)"'
 endif
+.PHONY: deploy-e2e
+deploy-e2e: dist
+	E2E_TESTING=true PLUGIN_E2E_MOCK_OAUTH_SERVER_URL=http://localhost:8080 ./build/bin/pluginctl deploy $(PLUGIN_ID) dist/$(BUNDLE_NAME)

build/setup.mk

@@ -1,14 +1,16 @@
+GO_BUILD_FLAGS ?=
+
 # Ensure that go is installed. Note that this is independent of whether or not a server is being
 # built, since the build script itself uses go.
 ifeq ($(GO),)
     $(error "go is not available: see https://golang.org/doc/install")
 endif
 
 # Ensure that the build tools are compiled. Go's caching makes this quick.
-$(shell cd build/manifest && $(GO) build -o ../bin/manifest)
+$(shell cd build/manifest && $(GO) build -buildvcs=false $(GO_BUILD_FLAGS) -o ../bin/manifest)
 
 # Ensure that the deployment tools are compiled. Go's caching makes this quick.
-$(shell cd build/pluginctl && $(GO) build -o ../bin/pluginctl)
+$(shell cd build/pluginctl && $(GO) build -buildvcs=false $(GO_BUILD_FLAGS) -o ../bin/pluginctl)
 
 # Extract the plugin id from the manifest.
 PLUGIN_ID ?= $(shell build/bin/manifest id)

e2e/playwright/.eslintrc.json

@@ -0,0 +1,18 @@
+{
+    "extends": [
+        "../../webapp/.eslintrc.json"
+    ],
+    "overrides": [
+        {
+            "files": ["**/*.ts"],
+            "plugins": ["import"],
+            "parser": "@typescript-eslint/parser",
+            "rules": {
+                "import/no-unresolved": "off",
+                "max-nested-callbacks": "off",
+                "no-shadow": "off",
+                "@typescript-eslint/no-shadow": "error"
+            }
+        }
+    ]
+}

e2e/playwright/.gitignore

@@ -3,3 +3,5 @@
 screenshots
 playwright-report
 test-results
+.auth-user.json
+.eslintcache

e2e/playwright/README.md

@@ -9,7 +9,7 @@ What this script does:
 - Install Playwright test dependencies - `cd ../e2e-tests/playwright && npm i`
 - Install Playwright - `npx install playwright`
 - Install GitHub plugin e2e dependencies - `cd ../../../mattermost-plugin-github/e2e/playwright && npm i`
-- Build and deploy plugin with mock OAuth server URL env var - `PLUGIN_E2E_MOCK_OAUTH_SERVER_URL=http://localhost:8080 make deploy`
+- Build and deploy plugin with e2e support - `make deploy-e2e`
 
 -----
 

e2e/playwright/mock_oauth_server/.env.sample

@@ -0,0 +1,5 @@
+# export MOCK_OAUTH_ACCESS_TOKEN=
+
+# export MM_SERVICESETTINGS_SITEURL=
+# export MM_PLUGIN_ID=
+# export OAUTH_SERVER_PORT=

e2e/playwright/mock_oauth_server/index.ts

@@ -1,3 +1,6 @@
+/* eslint-disable no-console */
+/* eslint-disable no-process-exit */
+/* eslint-disable no-process-env */
 require('dotenv').config();
 
 import {ExpiryAlgorithms, makeOAuthServer} from './mock_oauth_server';
@@ -8,7 +11,7 @@ if (!mockOAuthAccessToken) {
     process.exit(0);
 }
 
-const defaultAuthorizePrefix = '/login/oauth' // Used by GitHub
+const defaultAuthorizePrefix = '/login/oauth'; // Used by GitHub
 const authorizeURLPrefix = process.env.OAUTH_AUTHORIZE_URL_PREFIX || defaultAuthorizePrefix;
 
 const mattermostSiteURL = process.env.MM_SERVICESETTINGS_SITEURL || 'http://localhost:8065';
@@ -24,5 +27,6 @@ const app = makeOAuthServer({
 
 const port = process.env.OAUTH_SERVER_PORT || 8080;
 app.listen(port, () => {
+    // eslint-disable-next-line no-console
     console.log(`Mock OAuth server listening on port ${port}`);
 });

e2e/playwright/mock_oauth_server/mock_oauth_server.ts

@@ -20,7 +20,7 @@ export const makeOAuthServer = ({
     expiryAlgorithm,
 }: OAuthServerOptions): express.Express => {
     if (!mockOAuthAccessToken) {
-        throw new Error(`MockOAuthServer: Please provide an OAuth access token to use`);
+        throw new Error('MockOAuthServer: Please provide an OAuth access token to use');
     }
 
     if (expiryAlgorithm !== ExpiryAlgorithms.NO_EXPIRY) {
@@ -29,14 +29,15 @@ export const makeOAuthServer = ({
 
     const app = express();
 
+    // eslint-disable-next-line new-cap
     const oauthRouter = express.Router();
 
-    oauthRouter.get('/authorize', function (req, res) {
+    oauthRouter.get('/authorize', (req, res) => {
         const query = req.url.split('?')[1];
         res.redirect(`${mattermostSiteURL}/plugins/${pluginId}/oauth/complete?${query}&code=1234`);
     });
 
-    oauthRouter.post('/access_token', function (req, res) {
+    oauthRouter.post('/access_token', (req, res) => {
         const token = {
             access_token: mockOAuthAccessToken,
             token_type: 'bearer',
@@ -49,4 +50,4 @@ export const makeOAuthServer = ({
     app.use(authorizeURLPrefix, oauthRouter);
 
     return app;
-}
+};