| from __future__ import annotations |
|
|
| import json |
| import time |
| import unittest |
|
|
| try: |
| from .real_server import get_shared_server |
| except ImportError: |
| from real_server import get_shared_server |
|
|
| try: |
| from playwright.sync_api import Error as PlaywrightError |
| from playwright.sync_api import sync_playwright |
| except ImportError: |
| PlaywrightError = Exception |
| sync_playwright = None |
|
|
|
|
| @unittest.skipUnless(sync_playwright, "install requirements-test.txt and run: playwright install chromium") |
| class BrowserInteractionTests(unittest.TestCase): |
| @classmethod |
| def setUpClass(cls): |
| cls.server = get_shared_server() |
| cls.base_url = cls.server.base_url |
| cls.playwright = sync_playwright().start() |
| try: |
| cls.browser = cls.playwright.chromium.launch(headless=True, args=["--no-sandbox"]) |
| except PlaywrightError as error: |
| cls.playwright.stop() |
| raise unittest.SkipTest(f"Chromium is unavailable: {error}") |
|
|
| @classmethod |
| def tearDownClass(cls): |
| cls.browser.close() |
| cls.playwright.stop() |
|
|
| def open_page(self, viewport=None, search_handler=None): |
| context = self.browser.new_context(viewport=viewport or {"width": 1440, "height": 900}) |
| page = context.new_page() |
| errors = [] |
| page.on("pageerror", lambda error: errors.append(str(error))) |
| result = { |
| "Repo": "VoiceOfML/Test", "File": "手机资料", "Extension": "txt", |
| "Folder": ["测试目录"], "Size": 1024, "HasTxt": True, |
| "Link": "https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/test.txt", |
| "Path": "https://huggingface.co/datasets/VoiceOfML/Test/blob/main/test.txt", |
| } |
|
|
| def route_api(route, request): |
| path = request.url.split(self.base_url, 1)[-1] |
| if path.startswith("/api/search"): |
| body = request.post_data_json or {} |
| if search_handler: |
| return search_handler(route, request, body, result) |
| payload = {"results": [result], "total": 1, "page": body.get("page", 1), "page_size": body.get("page_size", 100)} |
| elif path.startswith("/api/repos"): |
| payload = [{"name": "VoiceOfML/Test", "count": 1}] |
| elif path.startswith("/api/extensions"): |
| payload = [{"name": "txt", "count": 1}] |
| elif path.startswith("/api/folders/Test/contents"): |
| payload = {"folders": [], "files": [], "current_path": ""} |
| elif path.startswith("/api/folders/Test"): |
| payload = [] |
| elif path.startswith("/api/random-txt/status"): |
| payload = {"available": True, "count": 1} |
| elif path.startswith("/api/random"): |
| payload = result |
| else: |
| payload = {} |
| route.fulfill(status=200, content_type="application/json", body=json.dumps(payload, ensure_ascii=False)) |
|
|
| page.route(self.base_url + "/api/**", route_api) |
| page.route( |
| "https://vomebook-hitokoto.hf.space/**", |
| lambda route: route.fulfill(status=200, content_type="application/json", body='{"hitokoto":"test"}'), |
| ) |
| page.goto(self.base_url + "/", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| return context, page, errors |
|
|
| def test_multi_term_highlight_never_marks_inside_tags_or_entities(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#search-input").fill("手机 a") |
| title = page.locator("#results-list .result-item .result-title").filter(has_text="手机资料").first |
| title.wait_for(timeout=15000) |
| self.assertEqual(title.evaluate("n => [...n.querySelectorAll('mark')].map(m => m.textContent)"), ["手机"]) |
| self.assertNotIn("rk>", title.inner_text()) |
| self.assertEqual(page.evaluate("highlightText('Tom & Jerry', 'tom amp')"), "<mark>Tom</mark> & Jerry") |
| self.assertEqual(page.evaluate("highlightText('abcab', 'ab abc')"), "<mark>abc</mark><mark>ab</mark>") |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_path_only_navigation_does_not_strand_pending_filter_render(self): |
| context, page, errors = self.open_page() |
| tree = [{"name": "Test", "path": "", "isRoot": True, "count": 2, "hasDirectFiles": False, "hasChildren": True, |
| "children": [{"name": n, "path": n, "count": 1, "hasDirectFiles": True, "hasChildren": False, |
| "children": []} for n in ("docs", "notes")]}] |
| held = [] |
|
|
| def folders(route): |
| if not held: |
| held.append(route) |
| else: |
| route.fulfill(status=200, content_type="application/json", body=json.dumps(tree)) |
| try: |
| page.route(self.base_url + "/api/folders/Test", folders) |
| page.evaluate("() => { STATE.rightSidebarOpen = true; ROUTER.navigate('repo', 'Test'); }") |
| deadline = time.time() + 15 |
| while not held and time.time() < deadline: |
| page.wait_for_timeout(50) |
| self.assertTrue(held, "folder tree request never started") |
| self.assertIn("加载中", page.locator("#filter-folder-tree").inner_text()) |
| |
| page.evaluate("() => ROUTER.navigate('repo', 'Test', 'docs')") |
| page.wait_for_function("STATE.browserPath === 'docs'") |
| page.locator('#filter-folder-tree .filter-folder-item[data-path="docs"]').wait_for(timeout=10000) |
| held[0].fulfill(status=200, content_type="application/json", body=json.dumps(tree)) |
| page.wait_for_function("!folderTreeRenderQueue.length") |
| paths = page.locator("#filter-folder-tree .filter-folder-item").evaluate_all("rows => rows.map(r => r.dataset.path)") |
| self.assertEqual(paths, ["docs", "notes"]) |
| self.assertIn("txt", page.locator("#filter-ext-list").inner_text()) |
| |
| page.evaluate("() => ROUTER.navigate('global')") |
| page.wait_for_function("STATE.mode === 'global'") |
| page.evaluate("() => ROUTER.navigate('repo', 'Test')") |
| page.wait_for_function("STATE.mode === 'repo' && STATE.folderTree && STATE.folderTree.length") |
| page.wait_for_function("!folderTreeRenderQueue.length") |
| paths = page.locator("#filter-folder-tree .filter-folder-item").evaluate_all("rows => rows.map(r => r.dataset.path)") |
| self.assertEqual(paths, ["docs", "notes"]) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_late_initial_payload_fallback_does_not_restart_a_newer_query(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#results-list .result-item").first.wait_for(timeout=15000) |
| result = page.evaluate('''() => new Promise(async done => { |
| const original = {fetchJsonWithTimeout, doSearch}; |
| let release, searches = 0; |
| fetchJsonWithTimeout = () => new Promise(resolve => { release = resolve; }); |
| doSearch = () => { searches++; }; |
| if (typeof readInitialSearchPayload === "function") { |
| original.readInitialSearchPayload = readInitialSearchPayload; |
| readInitialSearchPayload = () => null; |
| } |
| initialPayloadCache.clear(); |
| STATE.query = ""; STATE.page = 1; |
| const pending = searchWithInitialFallbackFresh(); |
| await new Promise(resolve => setTimeout(resolve, 50)); |
| const held = typeof release === "function"; |
| STATE.query = "late-payload-query"; |
| if (held) release(null); |
| await pending; |
| Object.assign(window, original); |
| done({held, searches}); |
| })''') |
| self.assertEqual(result, {"held": True, "searches": 0}) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_desktop_search_theme_filters_and_keyboard(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#search-input").fill("手机") |
| page.locator("#results-list .result-item").filter(has_text="手机资料").wait_for(timeout=15000) |
| self.assertIn("q=", page.url) |
| original_class = page.locator("body").get_attribute("class") |
| page.locator("#theme-btn").click() |
| self.assertNotEqual(original_class, page.locator("body").get_attribute("class")) |
| page.locator("#settings-btn").click() |
| page.locator("#sort-select").select_option("name") |
| page.locator("#sort-select").evaluate("node => node.blur()") |
| page.keyboard.press("Escape") |
| page.keyboard.press("/") |
| self.assertTrue(page.locator("#search-input").evaluate("node => document.activeElement === node")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_search_clear_control_tracks_query_state(self): |
| context, page, errors = self.open_page() |
| try: |
| search = page.locator("#search-input") |
| self.assertEqual(search.get_attribute("data-has-query"), "false") |
| self.assertFalse(page.locator("#search-box").evaluate("el => el.classList.contains('has-query')")) |
| search.fill("手机") |
| page.wait_for_function("document.getElementById('search-input').dataset.hasQuery === 'true'") |
| self.assertTrue(page.locator("#search-box").evaluate("el => el.classList.contains('has-query')")) |
| search.fill("") |
| page.wait_for_function("document.getElementById('search-input').dataset.hasQuery === 'false'") |
| self.assertFalse(page.locator("#search-box").evaluate("el => el.classList.contains('has-query')")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_malformed_api_envelopes_and_folder_errors_are_rejected(self): |
| context, page, errors = self.open_page() |
| try: |
| self.assertEqual(page.evaluate("""() => ({ |
| nullRecord: isValidSearchResponse({results:[null],total:1,page:1,page_size:100},1,100), |
| wrongTotal: isValidSearchResponse({results:[],total:1,page:1,page_size:100},1,100), |
| wrongPageSize: isValidSearchResponse({results:[],total:0,page:1,page_size:50},1,100), |
| oversized: isValidSearchResponse({results:Array(101).fill({}),total:101,page:1,page_size:100},1,100) |
| })"""), { |
| "nullRecord": False, "wrongTotal": False, |
| "wrongPageSize": False, "oversized": False, |
| }) |
| page.route( |
| self.base_url + "/api/folders/Test/contents*", |
| lambda route: route.fulfill(status=500, content_type="application/json", body='{"error":"temporary"}'), |
| ) |
| result = page.evaluate("""async () => { |
| try { await API.getContents('Test', ''); return 'resolved'; } |
| catch (error) { return error.message; } |
| }""") |
| self.assertIn("Invalid folder contents response", result) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_section_filter_cancel_buttons_follow_selected_state(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#settings-btn").click() |
| self.assertTrue(page.locator("#repo-filter-cancel").is_hidden()) |
| page.locator("#filter-ext-list input").first.check() |
| page.locator("#ext-filter-cancel").wait_for(state="visible") |
| page.locator("#filter-repo-list input").first.check() |
| page.locator("#repo-filter-cancel").wait_for(state="visible") |
| page.locator("#repo-filter-cancel").click() |
| self.assertEqual(page.evaluate("STATE.filterRepos"), []) |
| self.assertNotEqual(page.evaluate("STATE.filterExtensions"), []) |
| page.locator("#ext-filter-cancel").click() |
| self.assertEqual(page.evaluate("STATE.filterExtensions"), []) |
| page.goto(self.base_url + "/MLMRL-Hub", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.locator("#settings-btn").click() |
| page.evaluate("STATE.filterFolderSubtrees = ['archive']; updateFilterCancelButtons()") |
| page.locator("#folder-filter-cancel").click() |
| self.assertEqual(page.evaluate("[STATE.filterFolderSelfs, STATE.filterFolderSubtrees]"), [[], []]) |
| self.assertNotIn("folder_subtree=", page.url) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_repository_and_extension_filters_refresh_results(self): |
| search_bodies = [] |
|
|
| def search_handler(route, request, body, result): |
| search_bodies.append(body) |
| filtered = dict(result) |
| if body.get("repos"): |
| filtered["File"] = "仓库筛选结果" |
| elif body.get("extensions"): |
| filtered["File"] = "类型筛选结果" |
| route.fulfill( |
| status=200, |
| content_type="application/json", |
| body=json.dumps({ |
| "results": [filtered], |
| "total": 1, |
| "page": body.get("page", 1), |
| "page_size": body.get("page_size", 100), |
| }, ensure_ascii=False), |
| ) |
|
|
| context, page, errors = self.open_page(search_handler=search_handler) |
| try: |
| page.locator("#settings-btn").click() |
| extension = page.locator("#filter-ext-list input").first |
| extension.check() |
| page.wait_for_function("STATE.results[0] && STATE.results[0].File === '类型筛选结果'", timeout=5000) |
| self.assertTrue(extension.is_checked()) |
| self.assertTrue(any(body.get("extensions") == ["txt"] for body in search_bodies)) |
|
|
| page.locator("#ext-filter-cancel").click() |
| page.wait_for_function("STATE.filterExtensions.length === 0", timeout=5000) |
| repository = page.locator("#filter-repo-list input").first |
| repository.check() |
| page.wait_for_function("STATE.results[0] && STATE.results[0].File === '仓库筛选结果'", timeout=5000) |
| self.assertTrue(repository.is_checked()) |
| self.assertTrue(any(body.get("repos") == ["VoiceOfML/Test"] for body in search_bodies)) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_rapid_repository_filter_changes_are_coalesced(self): |
| search_bodies = [] |
|
|
| def search_handler(route, request, body, result): |
| search_bodies.append(body) |
| filtered = dict(result) |
| if body.get("repos"): |
| filtered["File"] = "批量仓库筛选结果" |
| route.fulfill( |
| status=200, |
| content_type="application/json", |
| body=json.dumps({ |
| "results": [filtered], |
| "total": 1, |
| "page": body.get("page", 1), |
| "page_size": body.get("page_size", 100), |
| }, ensure_ascii=False), |
| ) |
|
|
| context, page, errors = self.open_page(search_handler=search_handler) |
| try: |
| page.locator("#settings-btn").click() |
| page.evaluate("""() => { |
| renderCheckboxList(DOM.filterRepoList, [ |
| {key: 'VoiceOfML/Test', label: 'Test', count: 1}, |
| {key: 'VoiceOfML/Other', label: 'Other', count: 1}, |
| ], [], vals => { |
| STATE.filterRepos = vals; |
| STATE.page = 1; |
| updateFilterCancelButtons(); |
| scheduleFilterSearch(); |
| }); |
| const inputs = DOM.filterRepoList.querySelectorAll('input'); |
| for (const input of inputs) { |
| input.checked = true; |
| input.dispatchEvent(new Event('change', {bubbles: true})); |
| } |
| }""") |
| page.wait_for_function("STATE.results[0] && STATE.results[0].File === '批量仓库筛选结果'", timeout=5000) |
| filtered_requests = [body for body in search_bodies if body.get("repos")] |
| self.assertEqual(len(filtered_requests), 1) |
| self.assertEqual(filtered_requests[0]["repos"], ["VoiceOfML/Test", "VoiceOfML/Other"]) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_folder_filter_checkbox_updates_and_searches(self): |
| context, page, errors = self.open_page() |
| try: |
| page.goto(self.base_url + "/MLMRL-Hub", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.locator("#settings-btn").click() |
| page.locator("#filter-folder-section").wait_for(state="visible") |
| page.evaluate("""() => { |
| STATE.folderTree = [{ |
| name: "根", path: "", count: 1, isRoot: true, |
| hasDirectFiles: false, hasChildren: true, |
| children: [{ |
| name: "一级/二级", path: "一级/二级", count: 1, |
| hasDirectFiles: true, hasChildren: false, |
| children: [] |
| }] |
| }]; |
| STATE.folderTreeCollapsed = {}; |
| initializeFolderTreeCollapsed(STATE.folderTree); |
| renderFilterFolderTree(); |
| }""") |
| checkbox = page.locator("#filter-folder-tree .filter-folder-item input").last |
| checkbox.click() |
| page.wait_for_function("STATE.filterFolderSubtrees.includes('一级/二级')", timeout=5000) |
| self.assertTrue(checkbox.is_checked(), page.evaluate("""() => ({ |
| state: [STATE.filterFolderSelfs, STATE.filterFolderSubtrees], |
| inputs: [...document.querySelectorAll('#filter-folder-tree input')].map(input => [input.value, input.checked, input.indeterminate]) |
| })""")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_repository_directory_navigation_keeps_path_filters(self): |
| context, page, errors = self.open_page() |
| try: |
| page.goto(self.base_url + "/MLMRL-Hub?folder_self=docs&folder_subtree=archive%2F2026", wait_until="domcontentloaded") |
| page.wait_for_function("() => STATE.mode === 'repo' && STATE.filterFolderSelfs.includes('docs')") |
| for path in ("docs/nested", "docs", ""): |
| page.evaluate("path => ROUTER.navigate('repo', STATE.repo, path)", path) |
| params = page.evaluate("() => Object.fromEntries(new URL(location.href).searchParams)") |
| self.assertEqual(params.get("path", ""), path) |
| self.assertEqual(params.get("folder_self"), "docs") |
| self.assertEqual(params.get("folder_subtree"), "archive/2026") |
| self.assertEqual(page.evaluate("STATE.filterFolderSelfs"), ["docs"]) |
| self.assertEqual(page.evaluate("STATE.filterFolderSubtrees"), ["archive/2026"]) |
| page.evaluate("ROUTER.navigate('repo', 'VOMEBOOK', '')") |
| self.assertEqual(page.evaluate("STATE.filterFolderSelfs"), []) |
| self.assertNotIn("folder_self=", page.url) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_directory_tree_preview_stays_usable_during_slow_contents(self): |
| context, page, errors = self.open_page() |
| try: |
| page.evaluate("ROUTER.navigate('repo', 'Test', '')") |
| page.wait_for_function("() => STATE.mode === 'repo' && STATE.repo === 'Test'") |
| page.locator("#filter-ext-list input").first.wait_for(state="attached") |
| page.evaluate("""() => { |
| STATE.folderTree = [{name:'根目录', path:'', children:[ |
| {name:'docs', path:'docs', count:2, children:[ |
| {name:'nested', path:'docs/nested', count:1, children:[]} |
| ]} |
| ]}]; |
| }""") |
| pending = [] |
| page.route(self.base_url + "/api/folders/Test/contents?path=docs", lambda route: pending.append(route)) |
| page.evaluate("ROUTER.navigate('repo', 'Test', 'docs')") |
| page.wait_for_function("""() => STATE.browserPath === 'docs' && |
| !!document.querySelector('.browser-item[data-type="folder"][data-path="docs/nested"]')""") |
| self.assertEqual(page.locator(".browser-list .sidebar-loading").text_content(), "文件加载中...") |
| self.assertTrue(pending) |
| pending[0].fulfill(status=200, content_type="application/json", body=json.dumps({ |
| "folders": [{"name": "nested", "path": "docs/nested", "count": 1}], |
| "files": [{"name": "readme.txt", "ext": "txt", "size": 100, "hasTxt": False}] |
| })) |
| page.locator('.browser-item[data-type="file"] .browser-name').wait_for() |
| self.assertEqual(page.locator('.browser-item[data-type="file"] .browser-name').text_content(), "readme.txt") |
| warming = [] |
| page.route(self.base_url + "/api/folders/Test/contents?path=docs%2Fnested", |
| lambda route: warming.append(route)) |
| page.wait_for_function("() => API._browserPending.size === 0") |
| page.locator('.browser-item[data-type="folder"][data-path="docs/nested"]').dispatch_event("pointerover") |
| page.wait_for_function("() => API._browserPending.has('Test|docs/nested')", timeout=3000) |
| self.assertEqual(len(warming), 1) |
| page.evaluate("ROUTER.navigate('repo', 'Test', 'docs/nested')") |
| self.assertEqual(len(warming), 1) |
| warming[0].fulfill(status=200, content_type="application/json", body=json.dumps({ |
| "folders": [], "files": [{"name": "nested.txt", "ext": "txt", "size": 1}] |
| })) |
| page.locator('.browser-item[data-type="file"] .browser-name').wait_for() |
| self.assertEqual(page.locator('.browser-item[data-type="file"] .browser-name').text_content(), "nested.txt") |
| page.evaluate("API._browserCache.delete('Test|docs')") |
| page.route(self.base_url + "/api/folders/Test/contents?path=docs", |
| lambda route: route.fulfill(status=500, body='{}')) |
| page.evaluate("ROUTER.navigate('repo', 'Test', 'docs')") |
| page.locator('.browser-list .sidebar-loading').filter(has_text="正在重试").wait_for(timeout=5000) |
| page.locator('.browser-item[data-type="folder"][data-path="docs/nested"]').click() |
| page.locator('.browser-item[data-type="file"] .browser-name').filter(has_text="nested.txt").wait_for() |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_large_directory_navigation_keeps_search_page_and_filter_tree(self): |
| context, page, errors = self.open_page() |
| try: |
| page.goto(self.base_url + "/MLMRL-Hub", wait_until="domcontentloaded") |
| page.wait_for_function("() => STATE.mode === 'repo'") |
| page.locator("#filter-ext-list input").first.wait_for(state="attached") |
| page.evaluate("""() => { |
| STATE.folderTree = Array.from({length: 600}, (_, i) => ({ |
| name: `folder-${i}`, path: `folder-${i}`, count: 1, |
| hasDirectFiles: true, hasChildren: false, children: [] |
| })); |
| renderFilterFolderTree(); |
| window.__originalFilterRow = DOM.filterFolderTree.firstElementChild; |
| window.__filterRuns = 0; |
| window.__searchRuns = 0; |
| const render = renderFilters, search = searchWithInitialFallback; |
| renderFilters = (...args) => { window.__filterRuns++; return render(...args); }; |
| searchWithInitialFallback = (...args) => { window.__searchRuns++; return search(...args); }; |
| STATE.page = 3; |
| ROUTER.navigate('repo', STATE.repo, 'folder-300'); |
| }""") |
| self.assertTrue(page.evaluate("window.__originalFilterRow.isConnected")) |
| self.assertEqual(page.evaluate("[STATE.page, window.__searchRuns, window.__filterRuns]"), [3, 0, 0]) |
| page.evaluate("""() => { |
| const url = new URL(location.href); |
| url.searchParams.set('q', 'different query'); |
| history.pushState(null, '', url.href); |
| ROUTER.apply(); |
| }""") |
| self.assertFalse(page.evaluate("window.__originalFilterRow.isConnected")) |
| self.assertGreater(page.evaluate("window.__searchRuns"), 0) |
| self.assertGreater(page.evaluate("window.__filterRuns"), 0) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_deselected_self_files_button_has_neutral_hover_border(self): |
| context, page, errors = self.open_page() |
| try: |
| page.goto(self.base_url + "/MLMRL-Hub", wait_until="domcontentloaded") |
| page.locator("#filter-folder-section").wait_for(state="visible") |
| page.locator("#settings-btn").click() |
| page.locator("#right-sidebar.open").wait_for(state="visible") |
| page.evaluate("""() => { |
| STATE.folderTree = [{name:'根', path:'', count:2, isRoot:true, |
| showSelfToggle:true, hasDirectFiles:true, hasChildren:true, |
| children:[{name:'docs', path:'docs', count:1, hasDirectFiles:true, hasChildren:false, children:[]}]}]; |
| STATE.folderTreeCollapsed = {}; |
| renderFilterFolderTree(); |
| }""") |
| button = page.locator("#filter-folder-tree .folder-self-toggle") |
| button.click() |
| self.assertEqual(button.get_attribute("aria-pressed"), "true") |
| page.wait_for_timeout(220) |
| selected_border = button.evaluate("node => getComputedStyle(node).borderTopColor") |
| button.click() |
| self.assertEqual(button.get_attribute("aria-pressed"), "false") |
| page.wait_for_function("selected => getComputedStyle(document.querySelector('#filter-folder-tree .folder-self-toggle')).borderTopColor !== selected", arg=selected_border) |
| self.assertFalse(button.evaluate("node => node.classList.contains('active')")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_desktop_result_order_and_action_heights(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#search-input").fill("手机") |
| row = page.locator("#results-list .result-item").filter(has_text="手机资料") |
| row.wait_for(timeout=15000) |
| layout = row.evaluate("""node => { |
| const rect = selector => node.querySelector(selector).getBoundingClientRect(); |
| const title = rect('.result-title'); |
| const actions = rect('.result-actions'); |
| const path = rect('.result-path'); |
| const meta = rect('.result-meta'); |
| const buttons = [...node.querySelectorAll('.result-action-btn')].map(item => item.getBoundingClientRect().height); |
| return { |
| titleTop: title.top, |
| actionsTop: actions.top, |
| actionsBottom: actions.bottom, |
| pathTop: path.top, |
| pathBottom: path.bottom, |
| pathRight: path.right, |
| actionsLeft: actions.left, |
| metaTop: meta.top, |
| buttons, |
| }; |
| }""") |
| self.assertAlmostEqual(layout["titleTop"], layout["actionsTop"], delta=1) |
| self.assertGreaterEqual(layout["pathTop"], layout["actionsBottom"] - 1) |
| self.assertGreaterEqual(layout["metaTop"], layout["pathBottom"]) |
| self.assertGreater(layout["pathRight"], layout["actionsLeft"]) |
| self.assertEqual(len(layout["buttons"]), 4) |
| self.assertTrue(all(abs(height - 24) < 0.1 for height in layout["buttons"])) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_mobile_result_actions_use_compact_column(self): |
| context, page, errors = self.open_page({"width": 390, "height": 844}) |
| try: |
| page.locator("#search-input").fill("手机") |
| row = page.locator("#results-list .result-item").filter(has_text="手机资料") |
| row.wait_for(timeout=15000) |
| layout = row.evaluate("""node => { |
| const actions = node.querySelector('.result-actions').getBoundingClientRect(); |
| const buttons = [...node.querySelectorAll('.result-action-btn')].map(item => { |
| const rect = item.getBoundingClientRect(); |
| return {height: rect.height, top: rect.top}; |
| }); |
| return {height: actions.height, buttons}; |
| }""") |
| self.assertEqual(len(layout["buttons"]), 4) |
| self.assertTrue(all(abs(button["height"] - 20) < 0.1 for button in layout["buttons"])) |
| self.assertLessEqual(layout["height"], 83) |
| self.assertEqual(len({round(button["top"], 1) for button in layout["buttons"]}), 4) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_mobile_long_folder_uses_remaining_path_line(self): |
| context, page, errors = self.open_page({"width": 390, "height": 844}) |
| try: |
| layout = page.evaluate("""async () => { |
| STATE.results = [{ |
| Repo: "VoiceOfML/VOMEBOOK", |
| File: "路径换行测试", |
| Extension: "pdf", |
| Folder: [ |
| "马列之声ebook小组第七批成果集成(2018.8.17)", |
| "马列之声ebook小组第七批成果集成(2018.8.17)part 1a", |
| "2018.8 part 1", |
| ], |
| Size: 1, |
| }]; |
| STATE.total = 1; |
| STATE.hasMore = false; |
| resetVirtualScrollState(); |
| renderResults(); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| const path = document.querySelector('.result-path'); |
| const folders = [...path.querySelectorAll('.path-folder')]; |
| const first = document.createRange(); |
| first.selectNodeContents(folders[1]); |
| const repo = folders[0].getBoundingClientRect(); |
| const firstRect = first.getClientRects()[0]; |
| return { |
| repoTop: repo.top, |
| firstTop: firstRect.top, |
| firstLeft: firstRect.left, |
| separatorsNested: [...path.querySelectorAll('.path-sep')].every(sep => sep.parentElement.classList.contains('path-folder')), |
| }; |
| }""") |
| self.assertAlmostEqual(layout["firstTop"], layout["repoTop"], delta=1) |
| self.assertGreater(layout["firstLeft"], 0) |
| self.assertTrue(layout["separatorsNested"]) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_mobile_sidebar_and_view_toggle(self): |
| context, page, errors = self.open_page({"width": 390, "height": 844}) |
| try: |
| self.assertTrue(page.locator("body").evaluate("node => node.classList.contains('mobile')")) |
| was_open = page.locator("#left-sidebar").evaluate("node => node.classList.contains('open')") |
| page.locator("#hamburger-btn").click() |
| self.assertNotEqual(was_open, page.locator("#left-sidebar").evaluate("node => node.classList.contains('open')")) |
| page.locator("#mobile-toggle-btn").click() |
| self.assertFalse(page.locator("body").evaluate("node => node.classList.contains('mobile')")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_mobile_sidebars_do_not_add_history_guards(self): |
| context, page, errors = self.open_page({"width": 390, "height": 844}) |
| try: |
| page.goto(self.base_url + "/?sidebar=0", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| self.assertFalse(page.evaluate("history.state?.voiceSidebarGuard || history.state?.voiceSidebarOverlay")) |
| page.locator("#hamburger-btn").click() |
| page.wait_for_function("STATE.leftSidebarOpen") |
| self.assertFalse(page.evaluate("history.state?.voiceSidebarGuard || history.state?.voiceSidebarOverlay")) |
| page.locator("#settings-btn").click() |
| page.wait_for_function("STATE.rightSidebarOpen && !STATE.leftSidebarOpen") |
| self.assertFalse(page.evaluate("history.state?.voiceSidebarGuard || history.state?.voiceSidebarOverlay")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_mobile_reader_return_does_not_restore_closed_sidebar(self): |
| context, page, errors = self.open_page({"width": 390, "height": 844}) |
| try: |
| page.route("**/api/reader-content**", lambda route: route.fulfill( |
| content_type="text/plain", body="Reader navigation")) |
| page.wait_for_function("() => STATE.leftSidebarOpen") |
| url = "/static/reader.html?url=https%3A%2F%2Fhuggingface.co%2Fdatasets%2FVoiceOfML%2FTest%2Fresolve%2Fmain%2Fback.txt&ext=txt" |
| self.assertTrue(page.evaluate("url => navigateToReader(url)", url)) |
| reader = page.frame_locator("iframe.reader-overlay") |
| reader.locator(".reader-text").wait_for() |
| page.evaluate("history.back()") |
| page.locator("iframe.reader-overlay").wait_for(state="detached") |
| self.assertFalse(page.evaluate("STATE.leftSidebarOpen || STATE.rightSidebarOpen")) |
| self.assertIn("sidebar=0", page.url) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_sidebar_expand_button_keeps_svg_state(self): |
| context, page, errors = self.open_page({"width": 1440, "height": 900}) |
| try: |
| page.locator("#sidebar-content .repo-list-item").first.wait_for(state="visible") |
| page.locator("#sidebar-content .repo-list-item").first.click() |
| page.wait_for_function("STATE.mode === 'repo'") |
| button = page.locator("#sidebar-expand-btn") |
| self.assertEqual(button.locator("svg").count(), 1) |
| self.assertNotIn("→", button.inner_text()) |
| button.click() |
| self.assertTrue(page.locator("#left-sidebar").evaluate("node => node.classList.contains('expanded-wide')")) |
| self.assertTrue(button.evaluate("node => node.classList.contains('expanded')")) |
| self.assertEqual(button.locator("svg").count(), 1) |
| button.click() |
| self.assertFalse(page.locator("#left-sidebar").evaluate("node => node.classList.contains('expanded-wide')")) |
| self.assertFalse(button.evaluate("node => node.classList.contains('expanded')")) |
| self.assertEqual(button.locator("svg").count(), 1) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_mobile_sidebar_returns_by_directory_level(self): |
| context, page, errors = self.open_page({"width": 390, "height": 844}) |
| try: |
| heights = page.evaluate("[document.querySelector('.sidebar-header').getBoundingClientRect().height, document.querySelector('.status-bar').getBoundingClientRect().height]") |
| self.assertEqual(heights[0], heights[1]) |
| if page.locator("#left-sidebar").evaluate("node => !node.classList.contains('open')"): |
| page.locator("#hamburger-btn").click() |
| page.locator("#sidebar-content .repo-list-item").first.wait_for(state="visible") |
| page.locator("#sidebar-content .repo-list-item").first.click() |
| page.wait_for_function("STATE.mode === 'repo' && STATE.browserPath === ''") |
| self.assertTrue(page.locator("#sidebar-back-btn").is_visible()) |
| self.assertEqual(page.locator(".sidebar-breadcrumb").inner_text(), "根目录") |
|
|
| page.evaluate("ROUTER.navigate('repo', STATE.repo, 'docs')") |
| page.wait_for_function("STATE.browserPath === 'docs'") |
| page.evaluate("ROUTER.navigate('repo', STATE.repo, 'docs/part')") |
| page.wait_for_function("STATE.browserPath === 'docs/part'") |
| page.evaluate("history.back()") |
| page.wait_for_function("STATE.browserPath === 'docs'") |
| self.assertTrue(page.locator("#left-sidebar").evaluate("node => node.classList.contains('open')")) |
|
|
| page.locator("#sidebar-back-btn").click() |
| page.wait_for_function("STATE.browserPath === ''") |
| self.assertEqual(page.locator(".sidebar-breadcrumb").inner_text(), "根目录") |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_ime_composition_defers_search_until_composition_end(self): |
| requests = [] |
|
|
| def record_search(route, request, body, result): |
| requests.append(body.get("q", "")) |
| payload = {"results": [result], "total": 1, "page": 1, "page_size": 100} |
| route.fulfill(status=200, content_type="application/json", body=json.dumps(payload, ensure_ascii=False)) |
|
|
| context, page, errors = self.open_page(search_handler=record_search) |
| try: |
| |
| |
| page.wait_for_function("STATE._loadedPage >= 1 && !STATE.isLoading && pendingSearchPages.size === 0") |
| requests.clear() |
| page.locator("#search-input").dispatch_event("compositionstart") |
| page.locator("#search-input").fill("手") |
| page.wait_for_timeout(300) |
| self.assertEqual(requests, []) |
| page.locator("#search-input").dispatch_event("compositionend") |
| page.wait_for_function("() => new URL(location.href).searchParams.get('q') === '手'") |
| self.assertIn("手", requests) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_newer_search_result_wins_when_older_request_is_delayed(self): |
| context, page, errors = self.open_page() |
| try: |
| page.unroute(self.base_url + "/api/**") |
|
|
| def ordered(route, request): |
| path = request.url.split(self.base_url, 1)[-1] |
| if not path.startswith("/api/search"): |
| return route.fulfill(status=200, content_type="application/json", body="[]") |
| body = request.post_data_json or {} |
| query = body.get("q", "") |
| if query == "old": |
| time.sleep(0.4) |
| item = {"Repo": "VoiceOfML/Test", "File": query or "initial", "Extension": "txt", "Folder": [], "Size": 1, "HasTxt": False} |
| payload = {"results": [item], "total": 1, "page": 1, "page_size": 100} |
| route.fulfill(status=200, content_type="application/json", body=json.dumps(payload)) |
|
|
| page.route(self.base_url + "/api/**", ordered) |
| page.locator("#search-input").fill("old") |
| page.wait_for_timeout(130) |
| page.locator("#search-input").fill("new") |
| page.locator("#results-list .result-item").filter(has_text="new").wait_for(timeout=10000) |
| self.assertEqual(page.locator("#results-list .result-title").first.text_content(), "new.txt") |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_virtual_scroll_settles_and_thumb_drag_stays_covered(self): |
| context, page, errors = self.open_page() |
| try: |
| result = page.evaluate("""async () => { |
| const repeat = (value, count) => Array(count).fill(value).join(""); |
| STATE.results = Array.from({length: 800}, (_, index) => ({ |
| Repo: "VoiceOfML/Test", |
| File: index % 4 === 1 ? `virtual-${index}-` + repeat("长标题", 45) : `virtual-${index}`, |
| Extension: "txt", |
| Folder: index % 4 >= 2 ? Array.from({length: 10}, (_, part) => `很长的目录-${index}-${part}`) : [], |
| Size: index + 1, |
| HasTxt: index % 4 === 3, |
| })); |
| STATE.total = STATE.results.length; |
| STATE.hasMore = false; |
| STATE.isLoading = false; |
| DOM.resultsContainer.scrollTop = 0; |
| resetVirtualScrollState(); |
| renderResultsSkeleton(); |
| renderResults(); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| const skeletonCount = DOM.resultsList.querySelectorAll(".result-skeleton-item").length; |
| |
| const samples = []; |
| const container = DOM.resultsContainer; |
| for (const ratio of [0.82, 0.17, 0.94, 0.33, 0.7, 0.05, 1]) { |
| container.scrollTop = ratio * (container.scrollHeight - container.clientHeight); |
| container.dispatchEvent(new Event("scroll")); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| const rect = container.getBoundingClientRect(); |
| const hit = document.elementFromPoint(rect.left + rect.width / 2, rect.top + rect.height / 2); |
| const row = hit && hit.closest(".result-item"); |
| samples.push(row && row.querySelector(".result-title") ? Number(row.dataset.index) : null); |
| } |
| |
| container.scrollTop = 0.4 * (container.scrollHeight - container.clientHeight); |
| container.dispatchEvent(new Event("scroll")); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| const appendRect = container.getBoundingClientRect(); |
| const preservedRow = document.elementFromPoint( |
| appendRect.left + appendRect.width / 2, |
| appendRect.top + appendRect.height / 2, |
| ).closest(".result-item"); |
| const preservedIndex = preservedRow.dataset.index; |
| const heightBeforeAppend = container.scrollHeight; |
| const oldLength = STATE.results.length; |
| ensureHeightTree(); |
| const heightTreeBeforeAppend = VSCROLL.heightTree; |
| STATE.results = STATE.results.concat(Array.from({length: 100}, (_, index) => ({ |
| Repo: "VoiceOfML/Test", File: `appended-${index}`, Extension: "txt", Folder: [], Size: oldLength + index, |
| }))); |
| refreshVirtualAfterAppend(); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| let naiveHeight = 0; |
| let prefixMatches = true; |
| for (let index = 0; index < VSCROLL.heights.length; index++) { |
| naiveHeight += VSCROLL.heights[index]; |
| if (Math.abs(fenwickSum(VSCROLL.heightTree, index + 1) - naiveHeight) > 0.01) prefixMatches = false; |
| } |
| const measuredRow = DOM.resultsList.querySelector(`.result-item[data-index="${preservedIndex}"]`); |
| let repeatedReads = 0; |
| const originalRect = measuredRow.getBoundingClientRect.bind(measuredRow); |
| measuredRow.getBoundingClientRect = () => { repeatedReads++; return originalRect(); }; |
| VSCROLL.measuredWindowKey = ""; |
| measureHeights(VSCROLL.renderStart, VSCROLL.renderEnd); |
| const readsAtSameWidth = repeatedReads; |
| const originalWidth = DOM.resultsContainer.style.width; |
| DOM.resultsContainer.style.width = Math.max(200, container.clientWidth - 1) + "px"; |
| VSCROLL.measuredWindowKey = ""; |
| measureHeights(VSCROLL.renderStart, VSCROLL.renderEnd); |
| DOM.resultsContainer.style.width = originalWidth; |
| const preservedAfterAppend = preservedRow === DOM.resultsList.querySelector(`.result-item[data-index="${preservedIndex}"]`); |
| const treeExtendedInPlace = heightTreeBeforeAppend === VSCROLL.heightTree; |
| const heightAfterAppend = container.scrollHeight; |
| |
| updateScrollTrack(); |
| container.scrollTop = 0; |
| renderVisible(); |
| const thumbRect = DOM.scrollThumb.getBoundingClientRect(); |
| const trackRect = DOM.scrollTrack.getBoundingClientRect(); |
| DOM.scrollThumb.dispatchEvent(new MouseEvent("mousedown", { |
| bubbles: true, |
| clientY: thumbRect.top + thumbRect.height / 2, |
| })); |
| for (let step = 1; step <= 40; step++) { |
| document.dispatchEvent(new MouseEvent("mousemove", { |
| bubbles: true, |
| clientY: thumbRect.top + thumbRect.height / 2 + (trackRect.height - thumbRect.height) * step / 40, |
| })); |
| } |
| const scrollTopBeforeDragFrame = container.scrollTop; |
| await new Promise(resolve => requestAnimationFrame(resolve)); |
| const scrollTopAfterDragFrame = container.scrollTop; |
| const dragRect = container.getBoundingClientRect(); |
| const dragHit = document.elementFromPoint( |
| dragRect.left + dragRect.width / 2, |
| dragRect.top + dragRect.height / 2, |
| ); |
| const dragHitIndex = dragHit && dragHit.closest(".result-item") |
| ? Number(dragHit.closest(".result-item").dataset.index) |
| : null; |
| const dragDomCount = DOM.resultsList.querySelectorAll(".result-item").length; |
| document.dispatchEvent(new MouseEvent("mouseup", {bubbles: true})); |
| return { |
| samples, |
| skeletonCount, |
| preservedAfterAppend, |
| heightBeforeAppend, |
| heightAfterAppend, |
| treeExtendedInPlace, |
| prefixMatches, |
| readsAtSameWidth, |
| readsAfterWidthChange: repeatedReads, |
| scrollTopBeforeDragFrame, |
| scrollTopAfterDragFrame, |
| dragHitIndex, |
| dragDomCount, |
| draggingAfterMouseUp: VSCROLL.isDraggingThumb, |
| }; |
| }""") |
| self.assertTrue(all(index is not None for index in result["samples"])) |
| self.assertEqual(result["skeletonCount"], 0) |
| self.assertTrue(result["preservedAfterAppend"]) |
| self.assertGreater(result["heightAfterAppend"], result["heightBeforeAppend"]) |
| self.assertTrue(result["treeExtendedInPlace"]) |
| self.assertTrue(result["prefixMatches"]) |
| self.assertEqual(result["readsAtSameWidth"], 0) |
| self.assertGreater(result["readsAfterWidthChange"], result["readsAtSameWidth"]) |
| self.assertEqual(result["scrollTopBeforeDragFrame"], 0) |
| self.assertGreater(result["scrollTopAfterDragFrame"], result["scrollTopBeforeDragFrame"]) |
| self.assertIsNotNone(result["dragHitIndex"]) |
| self.assertLess(result["dragDomCount"], 50) |
| self.assertFalse(result["draggingAfterMouseUp"]) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_url_filter_roundtrip_restores_query_sort_and_size(self): |
| context, page, errors = self.open_page() |
| try: |
| page.goto(self.base_url + "/?q=phone&sort=name&min_size=1KB&max_size=2MB&search_folders=false&exact=0", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| self.assertEqual(page.locator("#search-input").input_value(), "phone") |
| self.assertEqual(page.locator("#sort-select").input_value(), "name") |
| self.assertEqual(page.locator("#filter-min-size").input_value(), "1") |
| self.assertEqual(page.locator("#filter-min-unit").input_value(), "KB") |
| self.assertFalse(page.locator("#search-folders-toggle").is_checked()) |
| self.assertFalse(page.locator("#exact-search-toggle").is_checked()) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_repository_folder_filters_remain_in_url_after_reload(self): |
| context, page, errors = self.open_page() |
| try: |
| url = self.base_url + "/MLMRL-Hub?folder_self=docs&folder_subtree=archive%2F2026" |
| page.goto(url, wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.wait_for_function("() => STATE.filterFolderSelfs.includes('docs') && STATE.filterFolderSubtrees.includes('archive/2026')") |
| self.assertEqual(page.url.count("folder_self=docs"), 1) |
| self.assertEqual(page.url.count("folder_subtree=archive%2F2026"), 1) |
| page.reload(wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.wait_for_function("() => STATE.filterFolderSelfs.includes('docs') && STATE.filterFolderSubtrees.includes('archive/2026')") |
| self.assertIn("folder_self=docs", page.url) |
| self.assertIn("folder_subtree=archive%2F2026", page.url) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_random_book_uses_deterministic_api_result(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#random-book-btn").click() |
| page.locator("#toast").filter(has_text="已发起下载").wait_for(timeout=5000) |
| iframe = page.locator('iframe[src^="/api/download?"]') |
| iframe.wait_for(state="attached") |
| self.assertIn("file=", iframe.get_attribute("src")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_reader_path_returns_to_matching_folder_filter(self): |
| context, page, errors = self.open_page() |
| try: |
| reader_url = page.evaluate("""() => getReaderLink({ |
| Repo: "VoiceOfML/Test", |
| File: "路径测试", |
| Extension: "txt", |
| Folder: ["一级目录", "二级目录"], |
| HasTxt: true, |
| Link: "https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/reader.txt", |
| })""") |
| page.goto(self.base_url + reader_url, wait_until="domcontentloaded") |
| path = page.locator("#reader-path") |
| path.wait_for(state="visible", timeout=10000) |
| self.assertEqual(path.text_content(), "Test/一级目录/二级目录") |
| |
| geometry = path.evaluate("""n => { const r = n.getBoundingClientRect(), h = n.parentElement.getBoundingClientRect(); |
| const range = document.createRange(); range.selectNodeContents(n); |
| return {button: r.width, heading: h.width, text: range.getBoundingClientRect().width}; }""") |
| self.assertLess(geometry["button"], geometry["heading"] - 40, geometry) |
| self.assertLessEqual(geometry["button"], geometry["text"] + 2, geometry) |
| self.assertTrue(page.locator("#status").is_hidden()) |
| path.click() |
| page.wait_for_url("**/Test?**", timeout=10000) |
| target = page.evaluate("() => ({pathname: location.pathname, folders: new URL(location.href).searchParams.getAll('folder_self')})") |
| self.assertEqual(target["pathname"], "/Test") |
| self.assertEqual(target["folders"], ["一级目录/二级目录"]) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_cancelled_extension_filter_is_not_restored_by_stale_reader_link(self): |
| context, page, errors = self.open_page() |
| try: |
| page.evaluate("STATE.filterExtensions = ['pdf']") |
| stale_reader_url = page.evaluate("""() => getReaderLink({ |
| Repo: "VoiceOfML/Test", File: "路径测试", Extension: "txt", Folder: ["docs"], HasTxt: true, |
| Link: "https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/path.txt", |
| })""") |
| page.evaluate("STATE.filterExtensions = []; saveStoredExtensionFilters()") |
| folder_url = page.evaluate("url => new URL(syncReaderFolderFilter(url), location.origin).searchParams.get('folder_url') || ''", stale_reader_url) |
| self.assertNotIn("ext=", folder_url) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_reader_back_closes_overlay_without_reloading_search(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#search-input").fill("手机") |
| page.wait_for_function("() => STATE.query === '手机' && new URL(location.href).searchParams.get('q') === '手机'") |
| marker = page.evaluate("() => { window.__readerReturnMarker = Math.random(); return window.__readerReturnMarker; }") |
| reader_url = page.evaluate("""() => getReaderLink({ |
| Repo: "VoiceOfML/Test", File: "返回测试", Extension: "txt", Folder: [], HasTxt: true, |
| Link: "https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/return.txt", |
| })""") |
| search_url = page.url |
| page.locator("#search-input").focus() |
| page.evaluate("""() => { |
| const stale = new URL('/static/reader.html?nav=stale', location.origin).href; |
| sessionStorage.setItem('reader-return:stale', location.href); |
| sessionStorage.setItem('reader-navigation-current', JSON.stringify({readerUrl: stale, shareUrl: stale})); |
| }""") |
| page.evaluate("url => navigateToReader(url)", reader_url) |
| self.assertEqual(page.evaluate("() => location.pathname"), "/static/reader.html") |
| self.assertNotIn("return=", page.url) |
| self.assertNotIn("nav=", page.url) |
| self.assertIsNone(page.evaluate("() => sessionStorage.getItem('reader-return:stale')")) |
| self.assertEqual(page.evaluate("() => Object.keys(sessionStorage).filter(key => key.startsWith('reader-return:')).length"), 1) |
| reader = page.frame_locator("iframe.reader-overlay") |
| reader.locator("#back").wait_for(state="visible") |
| reader.locator("html[data-reader-phase]").wait_for(state="attached") |
| initial_dark = page.evaluate("() => STATE.isDark") |
| reader.locator("#history").click() |
| reader.locator("#history-panel.is-open").wait_for(state="visible") |
| reader.locator("#theme-toggle").click() |
| page.wait_for_function("initial => STATE.isDark !== initial", arg=initial_dark) |
| self.assertEqual(reader.locator("html").get_attribute("data-theme"), "light" if initial_dark else "dark") |
| reader.locator("#theme-toggle").click() |
| page.wait_for_function("initial => STATE.isDark === initial", arg=initial_dark) |
| reader.locator("#history-close").click() |
| page.wait_for_function("() => document.activeElement === document.querySelector('iframe.reader-overlay')") |
| self.assertGreater(page.locator("body > [inert]").count(), 0) |
| reader.locator("#back").click() |
| page.locator("iframe.reader-overlay").wait_for(state="detached") |
| self.assertEqual(page.url, search_url) |
| self.assertEqual(page.evaluate("() => window.__readerReturnMarker"), marker) |
| self.assertTrue(page.locator("#search-input").evaluate("el => el === document.activeElement")) |
| self.assertEqual(page.locator("body > [inert]").count(), 0) |
| self.assertEqual(page.evaluate("() => performance.getEntriesByType('navigation')[0].type"), "navigate") |
| page.go_forward(wait_until="commit") |
| page.locator("iframe.reader-overlay").wait_for(state="attached") |
| self.assertEqual(page.evaluate("() => location.pathname"), "/static/reader.html") |
| page.evaluate("() => history.replaceState(null, '', location.href)") |
| page.reload(wait_until="domcontentloaded") |
| page.locator("#back").click() |
| page.locator("#search-input").wait_for(state="visible") |
| self.assertEqual(page.url, search_url) |
| page.wait_for_function("() => STATE.query === '手机'") |
| self.assertEqual(page.evaluate("() => Object.keys(sessionStorage).filter(key => key.startsWith('reader-return:')).length"), 0) |
| self.assertIsNone(page.evaluate("() => sessionStorage.getItem('reader-navigation-current')")) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_reader_back_restores_virtual_search_scroll(self): |
| context, page, errors = self.open_page() |
| try: |
| before = page.evaluate("""async () => { |
| STATE.results = Array.from({length: 240}, (_, index) => ({ |
| Repo: "VoiceOfML/Test", |
| File: `返回滚动-${index}`, |
| Extension: "txt", |
| Folder: index % 3 === 0 ? ["目录", `分组-${index}`] : [], |
| Size: index + 1, |
| HasTxt: true, |
| })); |
| STATE.total = STATE.results.length; |
| STATE.hasMore = false; |
| STATE.isLoading = false; |
| resetVirtualScrollState(); |
| renderResults(); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| DOM.resultsContainer.scrollTop = 520; |
| DOM.resultsContainer.dispatchEvent(new Event("scroll")); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| return DOM.resultsContainer.scrollTop; |
| }""") |
| self.assertGreater(before, 0) |
| page.evaluate("url => navigateToReader(url)", "/static/reader.html?title=返回滚动") |
| page.locator("iframe.reader-overlay").wait_for(state="attached") |
| page.evaluate("history.back()") |
| page.locator("iframe.reader-overlay").wait_for(state="detached") |
| page.wait_for_function( |
| "expected => Math.abs(DOM.resultsContainer.scrollTop - expected) <= 1", |
| arg=before, |
| timeout=10000, |
| ) |
| self.assertEqual(page.evaluate("DOM.resultsContainer.scrollTop"), before) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_system_back_exits_reader_in_one_step_with_panel_or_search_open(self): |
| |
| |
| context, page, errors = self.open_page() |
| try: |
| page.route("**/api/reader-content**", lambda route: route.fulfill( |
| content_type="text/plain", body="find-me in the book")) |
| url = "/static/reader.html?url=https%3A%2F%2Fhuggingface.co%2Fdatasets%2FVoiceOfML%2FTest%2Fresolve%2Fmain%2Fback.txt&ext=txt" |
| for view in ("panel", "full-search"): |
| before = page.evaluate("() => [location.href, history.length]") |
| page.evaluate("url => navigateToReader(url)", url) |
| reader = page.frame_locator("iframe.reader-overlay") |
| reader.locator(".reader-text").wait_for() |
| reader.locator("#history").click() |
| if view == "full-search": |
| reader.locator("#full-search-toggle").click() |
| reader.locator("#full-search-input").fill("find-me") |
| reader.locator(".full-search-result").wait_for() |
| page.wait_for_function("view => readerUiState === view", arg=view) |
| page.evaluate("""() => { window.__pushes = 0; const push = history.pushState.bind(history); |
| history.pushState = (...args) => { window.__pushes++; return push(...args); }; }""") |
| page.evaluate("history.back()") |
| page.locator("iframe.reader-overlay").wait_for(state="detached") |
| self.assertEqual(page.evaluate("window.__pushes"), 0, view) |
| self.assertEqual(page.evaluate("() => location.href"), before[0], view) |
| page.evaluate("() => { delete history.pushState; }") |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_search_snapshot_restores_results_and_page_cache(self): |
| context, page, errors = self.open_page() |
| try: |
| restored = page.evaluate("""async () => { |
| const first = [ |
| {Repo: "VoiceOfML/Test", File: "快照一", Extension: "txt", Folder: ["目录"], Size: 1}, |
| {Repo: "VoiceOfML/Test", File: "快照二", Extension: "txt", Folder: [], Size: 2}, |
| ]; |
| STATE.query = "快照查询"; |
| DOM.searchInput.value = STATE.query; |
| STATE.results = first; |
| STATE.total = 2; |
| STATE.page = 2; |
| STATE._loadedPage = 2; |
| STATE._pageCache = {1: first.slice(0, 1), 2: first.slice(1)}; |
| STATE.hasMore = true; |
| STATE.isLoading = false; |
| resetVirtualScrollState(); |
| renderResults(); |
| await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); |
| const key = getSearchViewKey(); |
| saveSearchViewSnapshot(key); |
| STATE.query = "另一个查询"; |
| DOM.searchInput.value = STATE.query; |
| STATE.results = []; |
| STATE.total = 0; |
| STATE.page = 1; |
| STATE._loadedPage = 0; |
| STATE._pageCache = {}; |
| renderResults(); |
| STATE.query = "快照查询"; |
| DOM.searchInput.value = STATE.query; |
| const didRestore = restoreSearchViewSnapshot(getSearchViewKey(), false); |
| return { |
| didRestore, |
| files: STATE.results.map(result => result.File), |
| total: STATE.total, |
| page: STATE.page, |
| loadedPage: STATE._loadedPage, |
| cachedPages: Object.keys(STATE._pageCache).sort(), |
| }; |
| }""") |
| self.assertTrue(restored["didRestore"]) |
| self.assertEqual(restored["files"], ["快照一", "快照二"]) |
| self.assertEqual(restored["total"], 2) |
| self.assertEqual(restored["page"], 2) |
| self.assertEqual(restored["loadedPage"], 2) |
| self.assertEqual(restored["cachedPages"], ["1", "2"]) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_reader_history_switch_updates_parent_url_and_state(self): |
| context, page, errors = self.open_page() |
| try: |
| page.locator("#search-input").fill("历史切书") |
| first_url = page.evaluate("""() => getReaderLink({ |
| Repo: "VoiceOfML/Test", File: "第一本", Extension: "txt", Folder: [], HasTxt: true, |
| Link: "https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/first.txt", |
| })""") |
| second_url = page.evaluate("""() => new URL(getReaderLink({ |
| Repo: "VoiceOfML/Test", File: "第二本", Extension: "txt", Folder: [], HasTxt: true, |
| Link: "https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/second.txt", |
| }), location.origin).href""") |
| search_url = page.url |
| page.evaluate("url => navigateToReader(url)", first_url) |
| page.frame_locator("iframe.reader-overlay").locator("#back").wait_for() |
| reader_frame = next(frame for frame in page.frames if frame.parent_frame is not None and "/static/reader.html" in frame.url) |
| page.wait_for_function("() => !!document.querySelector('iframe.reader-overlay')?.contentWindow?.VoiceOfMLReaderStore") |
| reader_frame.evaluate("""async (readerUrl) => VoiceOfMLReaderStore.put({ |
| url: 'https://huggingface.co/datasets/VoiceOfML/Test/resolve/main/second.txt', |
| title: '第二本.txt', extension: 'txt', readerUrl, page: 1, pageCount: 0, lastReadAt: Date.now() |
| })""", second_url) |
| |
| |
| reader_frame.wait_for_function("() => document.documentElement.dataset.readerPhase === 'ready'") |
| if reader_frame.locator("#history").get_attribute("aria-expanded") != "true": |
| reader_frame.locator("#history").click() |
| reader_frame.wait_for_function("() => document.querySelector('#history-panel').classList.contains('is-open')") |
| reader_frame.locator('.reader-panel-tabs button[data-panel="history"]').click() |
| reader_frame.locator("#history-list .panel-item-main").filter(has_text="第二本.txt").click() |
| page.wait_for_function("() => new URL(location.href).searchParams.get('title') === '第二本.txt'") |
| self.assertEqual(page.evaluate("() => new URL(history.state.readerUrl).searchParams.get('title')"), "第二本.txt") |
| page.frame_locator("iframe.reader-overlay").locator("#title").filter(has_text="第二本.txt").wait_for() |
| page.frame_locator("iframe.reader-overlay").locator("#back").click() |
| page.locator("iframe.reader-overlay").wait_for(state="detached") |
| self.assertEqual(page.url, search_url) |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
| def test_indexeddb_restores_last_search_but_explicit_url_wins(self): |
| context, page, errors = self.open_page() |
| try: |
| page.goto(self.base_url + "/?q=持久搜索&ext=pdf&filters=1", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.wait_for_function("() => STATE.query === '持久搜索' && STATE.filterExtensions.includes('pdf')") |
| page.wait_for_function("""async () => { |
| const db = await openSearchSessionDB(); |
| const tx = db.transaction('session', 'readonly'); |
| const request = tx.objectStore('session').get('last-search'); |
| const saved = await new Promise((resolve, reject) => { request.onsuccess = () => resolve(request.result); request.onerror = reject; }); |
| db.close(); |
| return saved && saved.url.includes(encodeURIComponent('持久搜索')); |
| }""") |
| page.close() |
| page = context.new_page() |
| page.on("pageerror", lambda error: errors.append(str(error))) |
| page.goto(self.base_url + "/", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.wait_for_function("() => STATE.query === '持久搜索' && STATE.filterExtensions.includes('pdf') && STATE.rightSidebarOpen") |
| page.goto(self.base_url + "/?q=显式搜索&ext=txt", wait_until="domcontentloaded") |
| page.locator("#search-input").wait_for(state="visible") |
| page.wait_for_function("() => STATE.query === '显式搜索' && STATE.filterExtensions.length === 1 && STATE.filterExtensions[0] === 'txt'") |
| self.assertEqual(errors, []) |
| finally: |
| context.close() |
|
|
|
|
| if __name__ == "__main__": |
| unittest.main() |
|
|
