Skip to content

SectionParallax - iOS background image issue #360

SectionParallax - iOS background image issue

SectionParallax - iOS background image issue #360

Triggered via push April 25, 2026 12:24
Status Failure
Total duration 2m 14s
Artifacts

test.yml

on: push
Matrix: test
Fit to window
Zoom out
Zoom in

Annotations

9 errors and 2 warnings
test (22)
Process completed with exit code 1.
app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts > BannerVideo > renders a <section> as the root element by default: app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts#L46
AssertionError: expected 'DIV' to be 'SECTION' // Object.is equality Expected: "SECTION" Received: "DIV" ❯ app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts:46:37
app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts > BannerVideo > renders correct HTML structure (all props set): app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts#L39
Error: Snapshot `BannerVideo > renders correct HTML structure (all props set) 1` mismatched - Expected + Received - "<header class="banner-video full-bleed" data-depth="xl" style="--_aspect-ratio: 16/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> + "<header class="banner-video full-bleed" data-depth="xl" style="--_aspect-ratio: 16/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" fetchpriority="high" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> <source src="/images/banners/video/lake-banner.mp4" type="video/mp4"> - </video><img width="1280" height="720" data-nuxt-img="" srcset="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg 1x, /_ipx/s_2560x1440/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="Lake banner" loading="eager" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg"></header>" + </video><img width="1280" height="720" data-nuxt-img="" srcset="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg 1x, /_ipx/s_2560x1440/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="Lake banner" loading="eager" fetchpriority="high" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg"></header>" ❯ app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts:39:28
app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts > BannerVideo > renders correct HTML structure (default props): app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts#L23
Error: Snapshot `BannerVideo > renders correct HTML structure (default props) 1` mismatched - Expected + Received - "<section class="banner-video" data-depth="md" style="--_aspect-ratio: 21/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> + "<div class="banner-video" data-depth="md" style="--_aspect-ratio: 21/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" fetchpriority="high" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> <source src="/images/banners/video/lake-banner.mp4" type="video/mp4"> - </video><img width="1920" height="1080" data-nuxt-img="" srcset="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg 1x, /_ipx/s_3840x2160/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="" loading="eager" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg"></section>" + </video><img width="1920" height="1080" data-nuxt-img="" srcset="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg 1x, /_ipx/s_3840x2160/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="" loading="eager" fetchpriority="high" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg"></div>" ❯ app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts:23:28
test (20)
The strategy configuration was canceled because "test._22" failed
test (20)
The operation was canceled.
app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts > BannerVideo > renders a <section> as the root element by default: app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts#L46
AssertionError: expected 'DIV' to be 'SECTION' // Object.is equality Expected: "SECTION" Received: "DIV" ❯ app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts:46:37
app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts > BannerVideo > renders correct HTML structure (all props set): app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts#L39
Error: Snapshot `BannerVideo > renders correct HTML structure (all props set) 1` mismatched - Expected + Received - "<header class="banner-video full-bleed" data-depth="xl" style="--_aspect-ratio: 16/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> + "<header class="banner-video full-bleed" data-depth="xl" style="--_aspect-ratio: 16/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" fetchpriority="high" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> <source src="/images/banners/video/lake-banner.mp4" type="video/mp4"> - </video><img width="1280" height="720" data-nuxt-img="" srcset="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg 1x, /_ipx/s_2560x1440/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="Lake banner" loading="eager" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg"></header>" + </video><img width="1280" height="720" data-nuxt-img="" srcset="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg 1x, /_ipx/s_2560x1440/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="Lake banner" loading="eager" fetchpriority="high" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1280x720/images/banners/video/lake-banner.jpg"></header>" ❯ app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts:39:28
app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts > BannerVideo > renders correct HTML structure (default props): app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts#L23
Error: Snapshot `BannerVideo > renders correct HTML structure (default props) 1` mismatched - Expected + Received - "<section class="banner-video" data-depth="md" style="--_aspect-ratio: 21/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> + "<div class="banner-video" data-depth="md" style="--_aspect-ratio: 21/9; --_align-self: center; --_justify-self: center;"><video class="video" autoplay="" muted="" loop="" playsinline="" preload="auto" fetchpriority="high" poster="/images/banners/video/lake-banner.jpg" style="object-fit: cover;"> <source src="/images/banners/video/lake-banner.mp4" type="video/mp4"> - </video><img width="1920" height="1080" data-nuxt-img="" srcset="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg 1x, /_ipx/s_3840x2160/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="" loading="eager" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg"></section>" + </video><img width="1920" height="1080" data-nuxt-img="" srcset="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg 1x, /_ipx/s_3840x2160/images/banners/video/lake-banner.jpg 2x" class="fallback" alt="" loading="eager" fetchpriority="high" decoding="async" style="object-fit: cover; object-position: center center;" src="/_ipx/s_1920x1080/images/banners/video/lake-banner.jpg"></div>" ❯ app/components/01.atoms/banner-video/tests/BannerVideo.spec.ts:23:28
test (22)
Node.js 20 actions are deprecated. The following actions are running on Node.js 20 and may not work as expected: actions/checkout@v4, actions/setup-node@v4. Actions will be forced to run with Node.js 24 by default starting June 2nd, 2026. Node.js 20 will be removed from the runner on September 16th, 2026. Please check if updated versions of these actions are available that support Node.js 24. To opt into Node.js 24 now, set the FORCE_JAVASCRIPT_ACTIONS_TO_NODE24=true environment variable on the runner or in your workflow file. Once Node.js 24 becomes the default, you can temporarily opt out by setting ACTIONS_ALLOW_USE_UNSECURE_NODE_VERSION=true. For more information see: https://github.blog/changelog/2025-09-19-deprecation-of-node-20-on-github-actions-runners/
test (20)
Node.js 20 actions are deprecated. The following actions are running on Node.js 20 and may not work as expected: actions/checkout@v4, actions/setup-node@v4. Actions will be forced to run with Node.js 24 by default starting June 2nd, 2026. Node.js 20 will be removed from the runner on September 16th, 2026. Please check if updated versions of these actions are available that support Node.js 24. To opt into Node.js 24 now, set the FORCE_JAVASCRIPT_ACTIONS_TO_NODE24=true environment variable on the runner or in your workflow file. Once Node.js 24 becomes the default, you can temporarily opt out by setting ACTIONS_ALLOW_USE_UNSECURE_NODE_VERSION=true. For more information see: https://github.blog/changelog/2025-09-19-deprecation-of-node-20-on-github-actions-runners/