CLD-8395 Integrate playwright into E2E tests (#28492)

* Finalize Playwright E2E scripts integration, add videos
* Add suggestion by Saturn

Co-authored-by: Saturnino Abril <5334504+saturninoabril@users.noreply.github.com>

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
Co-authored-by: Saturnino Abril <5334504+saturninoabril@users.noreply.github.com>

e2e-tests/.ci/server.run_playwright.sh

@@ -3,22 +3,21 @@ set -e -u -o pipefail
 cd "$(dirname "$0")"
 . .e2erc
 
-# Initialize Playwright report directory
 mme2e_log "Prepare Playwright: clean and initialize report and logs directory"
 ${MME2E_DC_SERVER} exec -T -u "$MME2E_UID" -- playwright bash <<EOF
 cd e2e-tests/playwright
-rm -rf logs playwright-report test-results storage_state
-mkdir -p logs
+rm -rf logs results storage_state
+mkdir -p logs results
 touch logs/mattermost.log
 EOF
 
-# Install webapp dependencies
-mme2e_log "Prepare Playwright: install webapp dependencies"
-${MME2E_DC_SERVER} exec -T -u "$MME2E_UID" -- playwright bash -c "cd webapp && npm install --cache /tmp/empty-cache"
-
-# Install Playwright dependencies
 mme2e_log "Prepare Playwright: install dependencies"
-${MME2E_DC_SERVER} exec -T -u "$MME2E_UID" -- playwright bash -c "cd e2e-tests/playwright && rm -rf node_modules && PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD=1 npm install --cache /tmp/empty-cache"
+${MME2E_DC_SERVER} exec -T -u "$MME2E_UID" -- playwright bash <<EOF
+cd webapp/
+npm install --cache /tmp/empty-cache
+cd ../e2e-tests/playwright
+npm install --cache /tmp/empty-cache
+EOF
 
 mme2e_log "Prepare Playwright: environment info"
 ${MME2E_DC_SERVER} exec -T -u "$MME2E_UID" -- playwright bash <<"EOF"
@@ -37,8 +36,21 @@ EOF
 # export DEBUG=pw:protocol,pw:browser,pw:api
 
 # Run Playwright test
-# Note: Run on chrome but eventually will enable to all projects which include firefox and ipad.
-${MME2E_DC_SERVER} exec -i -u "$MME2E_UID" -- playwright bash -c "cd e2e-tests/playwright && npm run test -- --project=chrome" | tee ../playwright/logs/playwright.log
+# NB: do not exit the script if some testcases fail
+${MME2E_DC_SERVER} exec -i -u "$MME2E_UID" -- playwright bash -c "cd e2e-tests/playwright && npm run test -- ${TEST_FILTER}" | tee ../playwright/logs/playwright.log || true
+
+# Collect run results
+# Documentation on the results.json file: https://playwright.dev/docs/api/class-testcase#test-case-expected-status
+# NB: the following line is needed only for compatibility reasons, to support RollingRelease tests for versions prior to v10.1.0
+#     It can be removed after releases <=v10.0.x are phased out
+mv -v ../playwright/playwright-report/results.json ../playwright/results/results.json || true
+jq -f /dev/stdin ../playwright/results/results.json > ../playwright/results/summary.json <<EOF
+{
+  passed: .stats.expected,
+  failed: .stats.unexpected,
+  failed_expected: (.stats.skipped + .stats.flaky)
+}
+EOF
 
 # Collect server logs
 ${MME2E_DC_SERVER} logs --no-log-prefix -- server >../playwright/logs/mattermost.log 2>&1