test(mobile): basic e2e tests (#8031)

fix AF-1289

1. tested on 'webkit'
2. a few baseline test cases

packages/frontend/core/src/bootstrap/preload.ts

@@ -1,9 +1,9 @@
+import { ResizeObserver } from '@juggle/resize-observer';
+window.ResizeObserver = ResizeObserver;
+
 import '@affine/env/constant';
 import './edgeless-template';
 
 import { setupGlobal } from '@affine/env/global';
-import { ResizeObserver } from '@juggle/resize-observer';
 
 setupGlobal();
-
-window.ResizeObserver = ResizeObserver;

packages/frontend/core/src/components/app-sidebar/category-divider/index.tsx

@@ -35,6 +35,7 @@ export const CategoryDivider = forwardRef(
       <div
         className={clsx(mobile ? styles.mobileRoot : styles.root, className)}
         ref={ref}
+        role="switch"
         onClick={() => setCollapsed?.(!collapsed)}
         data-mobile={mobile}
         data-collapsed={collapsed}

packages/frontend/core/src/modules/explorer/views/layouts/collapsible-section.tsx

@@ -81,6 +81,7 @@ export const CollapsibleSection = ({
         {mobile ? null : actions}
       </CategoryDivider>
       <Collapsible.Content
+        data-testid="collapsible-section-content"
         className={clsx(mobile ? mobileContent : content, contentClassName)}
       >
         {children}