Fix E2E tests (#4044)

This commit is contained in:
Greg Bergé
2026-02-25 09:57:47 +01:00
committed by GitHub
parent 3d8e89cbe9
commit f49b0af3fe
13 changed files with 24 additions and 15 deletions
+4
View File
@@ -149,6 +149,7 @@ const searchTestCases: Test[] = [
mode: CustomizationAIMode.Assistant,
},
}),
screenshot: false,
run: async (page) => {
await waitForCookiesDialog(page);
const searchInput = page.locator('css=[data-testid="search-input"]');
@@ -185,6 +186,7 @@ const searchTestCases: Test[] = [
mode: CustomizationAIMode.Assistant,
},
}),
screenshot: false,
run: async (page) => {
await waitForCookiesDialog(page);
await page.keyboard.press('ControlOrMeta+I');
@@ -218,6 +220,7 @@ const searchTestCases: Test[] = [
mode: CustomizationAIMode.Assistant,
},
})}&ask=`,
screenshot: false,
run: async (page) => {
await waitForCookiesDialog(page);
await expect(page.getByTestId('search-input')).not.toBeFocused();
@@ -235,6 +238,7 @@ const searchTestCases: Test[] = [
mode: CustomizationAIMode.Assistant,
},
})}&ask=${encodeURIComponent(AI_PROMPT)}`,
screenshot: false,
run: async (page) => {
await waitForCookiesDialog(page);
await expect(page.getByTestId('search-input')).not.toBeFocused();
@@ -77,7 +77,8 @@ export async function AdCoverRendering({
'shadow-md',
'max-h-32',
'group-hover/ad:max-h-16',
'motion-safe:transition-all'
'transition-all',
'motion-reduce:transition-none'
)}
/>
</div>
@@ -93,7 +94,8 @@ export async function AdCoverRendering({
'opacity-0',
'group-hover/ad:h-16',
'group-hover/ad:opacity-10',
'motion-safe:transition-all'
'transition-all',
'motion-reduce:transition-none'
)}
>
{ad.description}
@@ -34,7 +34,7 @@ export function AnnouncementBanner(props: {
className="theme-bold:bg-header-background pt-4 pb-2"
data-nosnippet=""
>
<div className="transition-all duration-300 lg:chat-open:pr-80 xl:chat-open:pr-96">
<div className="transition-all duration-300 motion-reduce:transition-none lg:chat-open:pr-80 xl:chat-open:pr-96">
<div className={tcls('relative', CONTAINER_STYLE)}>
<Tag
href={contentRef?.href ?? ''}
@@ -82,7 +82,8 @@ export function CookiesToast(props: { privacyPolicy?: string }) {
'sm:left-auto',
'lg:chat-open:mr-80',
'xl:chat-open:mr-100',
'motion-safe:transition-all',
'transition-all',
'motion-reduce:transition-none',
'duration-300',
'text-sm'
)}
@@ -120,7 +120,7 @@ export function EmbeddableFrameSidebar(props: { children: React.ReactNode }) {
const { children } = props;
return (
<div className="flex w-15 shrink-0 origin-top not-hydrated:animate-blur-in-slow flex-col gap-2 overflow-hidden border-tint-solid/3 border-r bg-tint-solid/1 p-2 transition-all transition-discrete duration-300 empty:hidden empty:w-0 empty:px-0">
<div className="flex w-15 shrink-0 origin-top not-hydrated:animate-blur-in-slow flex-col gap-2 overflow-hidden border-tint-solid/3 border-r bg-tint-solid/1 p-2 transition-all transition-discrete duration-300 empty:hidden empty:w-0 empty:px-0 motion-reduce:transition-none">
{children}
</div>
);
@@ -35,7 +35,7 @@ export function Footer(props: { context: GitBookSiteContext }) {
mobileOnly ? 'xl:hidden' : null
)}
>
<div className="motion-safe:transition-[padding] motion-safe:duration-300 lg:chat-open:pr-80 xl:chat-open:pr-96">
<div className="transition-[padding] duration-300 motion-reduce:transition-none lg:chat-open:pr-80 xl:chat-open:pr-96">
<div
className={tcls(
CONTAINER_STYLE,
@@ -68,7 +68,7 @@ export function Header(props: {
'site-header:theme-bold:shadow-tint-12/2'
)}
>
<div className="transition-all duration-300 lg:chat-open:pr-80 xl:chat-open:pr-96">
<div className="transition-all duration-300 motion-reduce:transition-none lg:chat-open:pr-80 xl:chat-open:pr-96">
<div
data-gb-header-content
className={tcls(
@@ -82,7 +82,7 @@ export function Header(props: {
'min-h-16',
'sm:h-16',
CONTAINER_STYLE,
'transition-[max-width] duration-300',
'transition-[max-width] duration-300 motion-reduce:transition-none',
'@container/header'
)}
>
@@ -120,7 +120,7 @@ export function Header(props: {
'justify-self-end',
'items-center',
'gap-2',
'transition-[margin] duration-300',
'transition-[margin] duration-300 motion-reduce:transition-none',
'search' in customization.styling &&
customization.styling.search === 'prominent'
? [
@@ -201,7 +201,7 @@ export function Header(props: {
</div>
{visibleSections && withSections ? (
<div className="transition-[padding] duration-300 lg:chat-open:pr-80 xl:chat-open:pr-96">
<div className="transition-[padding] duration-300 motion-reduce:transition-none lg:chat-open:pr-80 xl:chat-open:pr-96">
<SiteSectionTabs sections={encodeClientSiteSections(context, visibleSections)}>
{variants.translations.length > 1 ? (
<TranslationsDropdown
@@ -11,7 +11,7 @@ export function ImagesLoadingStatus(props: {
const { language } = props;
const state = useImagesLoadingState();
return (
<p className="text-right text-slate-500 text-xs">
<p className="text-right text-slate-500 text-xs" data-visual-test="removed">
{(() => {
switch (state.status) {
case 'pending':
@@ -59,7 +59,7 @@ export function PageAside(props: {
'hydrated:starting:max-w-0',
'hydrated:starting:opacity-0',
'transition-[margin,max-width,opacity,display] duration-300',
'transition-[margin,max-width,opacity,display] duration-300 motion-reduce:transition-none',
'transition-discrete',
'basis-56',
@@ -73,6 +73,7 @@ export function ScrollSectionsList({ sections }: { sections: DocumentSection[] }
'px-3',
'transition-all',
'motion-reduce:transition-none',
'duration-200',
'rounded-md',
@@ -86,6 +86,7 @@ export async function PageCover(props: {
// Negative margin to balance the container padding
'-mx-4',
'transition-all',
'motion-reduce:transition-none',
as === 'full'
? [
'sm:-mx-6',
@@ -121,7 +121,7 @@ export function SpaceLayout(props: SpaceLayoutProps) {
<NavigationLoader />
{customization.ai?.mode === CustomizationAIMode.Assistant ? <AIChat /> : null}
<div className="motion-safe:transition-all motion-safe:duration-300 lg:chat-open:mr-80 xl:chat-open:mr-96">
<div className="transition-all duration-300 motion-reduce:transition-none lg:chat-open:mr-80 xl:chat-open:mr-96">
<div
className={tcls(
'flex',
@@ -130,7 +130,7 @@ export function SpaceLayout(props: SpaceLayoutProps) {
'lg:justify-center',
CONTAINER_STYLE,
'site-width-wide:max-w-screen-4xl',
'transition-[max-width] duration-300',
'transition-[max-width] duration-300 motion-reduce:transition-none',
// Ensure the footer is display below the viewport even if the content is not enough
withFooter && [
@@ -20,7 +20,7 @@ export function Popover(props: {
collisionPadding={contentProps?.collisionPadding ?? 16}
sideOffset={contentProps?.sideOffset ?? 4}
className={tcls(
'z-50 max-h-(--radix-popover-content-available-height) max-w-xs animate-scale-in overflow-y-auto overflow-x-hidden circular-corners:rounded-3xl rounded-corners:rounded-md bg-tint px-4 py-3 text-sm text-tint depth-subtle:shadow-xl shadow-tint-12/4 outline-hidden ring-1 ring-tint transition-all empty:hidden data-[state="closed"]:animate-scale-out dark:shadow-tint-1/6',
'z-50 max-h-(--radix-popover-content-available-height) max-w-xs animate-scale-in overflow-y-auto overflow-x-hidden circular-corners:rounded-3xl rounded-corners:rounded-md bg-tint px-4 py-3 text-sm text-tint depth-subtle:shadow-xl shadow-tint-12/4 outline-hidden ring-1 ring-tint transition-all empty:hidden data-[state="closed"]:animate-scale-out motion-reduce:transition-none dark:shadow-tint-1/6',
contentProps?.className
)}
style={{