This commit fixes an issue where tooltips create unwanted horizontal overflow on mobile devices. An overlay has been added to contain the tooltip within the viewport, ensuring it doesn't disrupt the page layout. The changes include adjustments to CSS visibility and pointer event handling for the tooltip container and its children. Changes: - Introduce an overlay that spans the entire viewport for the tooltip container. - Add CSS rules to ensure the tooltip and its children maintain correct pointer events and overflow behavior. - Add a Cypress end-to-end test that verifies the absence of the unintended horizontal overflow on small screens. - Uploads videos/screenshots as artifacts during CI/CD to provide easier troubleshooting. This change is supported by creating `cypress-dirs.json` to be able to share directory information with CI/CD runners and cypress configuration file.
64 lines
1.9 KiB
YAML
64 lines
1.9 KiB
YAML
name: e2e-tests
|
|
|
|
on:
|
|
push:
|
|
pull_request:
|
|
|
|
jobs:
|
|
run-tests:
|
|
strategy:
|
|
matrix:
|
|
os: [macos, ubuntu, windows]
|
|
fail-fast: false # So it still runs on other OSes if one of them fails
|
|
runs-on: ${{ matrix.os }}-latest
|
|
steps:
|
|
-
|
|
name: Checkout
|
|
uses: actions/checkout@v4
|
|
-
|
|
name: Setup node
|
|
uses: ./.github/actions/setup-node
|
|
-
|
|
name: Install dependencies
|
|
uses: ./.github/actions/npm-install-dependencies
|
|
-
|
|
name: Run e2e tests
|
|
run: npm run test:cy:run
|
|
-
|
|
name: Output artifact directories
|
|
id: artifacts
|
|
shell: bash
|
|
run: |-
|
|
declare -r dirs_json_file='cypress-dirs.json'
|
|
if [ ! -f "${dirs_json_file}" ]; then
|
|
echo "${dirs_json_file} does not exist"
|
|
exit 1
|
|
fi
|
|
|
|
SCREENSHOTS_DIR=$(jq -r '.screenshots' "${dirs_json_file}")
|
|
VIDEOS_DIR=$(jq -r '.videos' "${dirs_json_file}")
|
|
|
|
for dir in "${SCREENSHOTS_DIR}" "${VIDEOS_DIR}"; do
|
|
if [ "${dir}" = 'null' ] || [ -z "${dir}" ]; then
|
|
echo "One or more directories are null or not specified in cypress-dirs.json"
|
|
exit 1
|
|
fi
|
|
done
|
|
|
|
echo "SCREENSHOTS_DIR=${SCREENSHOTS_DIR}" >> "${GITHUB_OUTPUT}"
|
|
echo "VIDEOS_DIR=${VIDEOS_DIR}" >> "${GITHUB_OUTPUT}"
|
|
-
|
|
name: Upload screenshots
|
|
if: failure() # Run only if previous step fails because screenshots will be generated only if E2E test failed
|
|
uses: actions/upload-artifact@v3
|
|
with:
|
|
name: e2e-screenshots
|
|
path: ${{ steps.artifacts.outputs.SCREENSHOTS_DIR }}
|
|
-
|
|
name: Upload videos
|
|
if: always() # Run even if previous step fails because test run video is always captured
|
|
uses: actions/upload-artifact@v3
|
|
with:
|
|
name: e2e-videos
|
|
path: ${{ steps.artifacts.outputs.VIDEOS_DIR }}
|