-
平台连接
-
- {{ statusText }} · {{ version }}
-
+
+
+
+
KF ONLINEJUDGE / PRACTICE SPACE
+
把想法写成代码，
让思路一步步清晰。
+
+ 从一道题开始，沿着自己的节奏练习。
在这里写代码、做训练，也和同伴一起迎接新的挑战。
+
+
+ 开始解题 浏览训练题单
+
+
+ {{ problems.length }} 道示例题目{{ problemTags.length }} 个算法标签ACM / OI
-
重新检查
+
+
+
+
+
+
+ 站内公告示例内容
+
+
+
+
+
+ 查看评测
+
+
+ 累计提交544次
+
+
+ 通过提交342次
+
+
+ 统计周期09.28 — 10.04
+
+
+
+
+
+
+
+
+ 完整题库
+
+
+ 换一个角度，试试新的解法。按专题练习
+
+
+
+ 全部
+ {{ String(index + 1).padStart(2, '0') }}{{ user.username[0] }}
+
+
{{ user.username }}
+
{{ user.motto }}
+
+
+
+
+
+
NEXT CHALLENGE
+
给下一场挑战留点时间。
+
+
比赛日历
+
+
+ {{ contest.type }}{{ contest.status }}
+
+ {{ contest.title }}
+ {{ contest.start }} · {{ contest.duration }}
+ 查看比赛
+
示例赛程，实际安排以平台发布的信息为准。
+
+
+ 练习之外，也可以一起聊聊。讨论交流 创建团队 关于 KF OJ
+
+
+
{{ selectedNotice.date }} · {{ selectedNotice.category }} · 示例公告
+ {{ selectedNotice.text }}
+
From 1443f0049507c2f1515eb40843e993484ef8472e Mon Sep 17 00:00:00 2001
From: kronecker <2026692687@qq.com>
Date: Mon, 5 Oct 2026 01:50:02 +0800
Subject: [PATCH 6/8] feat(frontend): add account and community page previews
Add profiles, discussions, team creation, authentication forms and the about page.
Validate preview forms and display the available platform health endpoint.
---
frontend/src/router/index.ts | 33 ++++++
frontend/src/views/AboutView.vue | 81 +++++++++++++++
frontend/src/views/AuthView.vue | 100 +++++++++++++++++++
frontend/src/views/CreateTeamView.vue | 69 +++++++++++++
frontend/src/views/DiscussionDetailView.vue | 40 ++++++++
frontend/src/views/DiscussionsView.vue | 77 ++++++++++++++
frontend/src/views/LogoutView.vue | 13 +++
frontend/src/views/ProfileView.vue | 105 ++++++++++++++++++++
frontend/src/views/TeamsView.vue | 61 ++++++++++++
9 files changed, 579 insertions(+)
create mode 100644 frontend/src/views/AboutView.vue
create mode 100644 frontend/src/views/AuthView.vue
create mode 100644 frontend/src/views/CreateTeamView.vue
create mode 100644 frontend/src/views/DiscussionDetailView.vue
create mode 100644 frontend/src/views/DiscussionsView.vue
create mode 100644 frontend/src/views/LogoutView.vue
create mode 100644 frontend/src/views/ProfileView.vue
create mode 100644 frontend/src/views/TeamsView.vue
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index f4524b4..b9da1e3 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -54,6 +54,39 @@ export const router = createRouter({
meta: { title: '排名' },
component: () => import('../views/RankingsView.vue'),
},
+ {
+ path: '/discussions',
+ meta: { title: '讨论' },
+ component: () => import('../views/DiscussionsView.vue'),
+ },
+ {
+ path: '/discussions/:id',
+ meta: { title: '讨论详情' },
+ component: () => import('../views/DiscussionDetailView.vue'),
+ },
+ { path: '/teams', meta: { title: '团队' }, component: () => import('../views/TeamsView.vue') },
+ {
+ path: '/teams/create',
+ meta: { title: '创建团队' },
+ component: () => import('../views/CreateTeamView.vue'),
+ },
+ {
+ path: '/users/:username',
+ meta: { title: '个人主页' },
+ component: () => import('../views/ProfileView.vue'),
+ },
+ { path: '/login', meta: { title: '登录' }, component: () => import('../views/AuthView.vue') },
+ {
+ path: '/register',
+ meta: { title: '注册' },
+ component: () => import('../views/AuthView.vue'),
+ },
+ {
+ path: '/logout',
+ meta: { title: '退出登录' },
+ component: () => import('../views/LogoutView.vue'),
+ },
+ { path: '/about', meta: { title: '关于' }, component: () => import('../views/AboutView.vue') },
{
path: '/:pathMatch(.*)*',
name: 'not-found',
diff --git a/frontend/src/views/AboutView.vue b/frontend/src/views/AboutView.vue
new file mode 100644
index 0000000..a6df682
--- /dev/null
+++ b/frontend/src/views/AboutView.vue
@@ -0,0 +1,81 @@
+
+
+
+
+
+
CODE · PRACTICE · GROW
+
让思路在代码里落地。
+
+ KF OnlineJudge
+ 是一个正在开发的在线评测项目，关注判题、沙箱、分布式执行与故障恢复，并逐步提供辅助答疑和个性化训练。
+
+
+
KF.
+
+
+
+
+
{{ feature.title }}
+
{{ feature.text }}
+
+
+
+
+ 平台 API
+ {{ status }}
+
+
+ 这是实际的 API 存活检查。{{ version && state === 'connected' ? '版本 ' + version : '' }}
+
+
数据库、题库、评测与学习服务将分别接入。
+
+
重新检查
+
+
+ 当前为前端预览版本。题目、比赛、排名和用户信息使用示例数据；页面筛选、导航和本地代码草稿已可使用。
+
+
+ 题目页可以选择语言、切换编辑器主题、保存草稿和填写自测输入。实际评测、账号和团队创建将在服务接入后开放。
+
+
备案信息待填写，平台规则和联系方式将在上线前补充。
+
+
diff --git a/frontend/src/views/AuthView.vue b/frontend/src/views/AuthView.vue
new file mode 100644
index 0000000..6f550a7
--- /dev/null
+++ b/frontend/src/views/AuthView.vue
@@ -0,0 +1,100 @@
+
+
+
+
+
+
diff --git a/frontend/src/views/CreateTeamView.vue b/frontend/src/views/CreateTeamView.vue
new file mode 100644
index 0000000..0b219c1
--- /dev/null
+++ b/frontend/src/views/CreateTeamView.vue
@@ -0,0 +1,69 @@
+
+
+ 返回团队列表公开团队私有团队
+ 公开团队可在团队列表中发现，私有团队通过邀请加入。
需要审核仅接受邀请
+
+ 检查填写创建团队团队服务待接入
+
+
diff --git a/frontend/src/views/DiscussionDetailView.vue b/frontend/src/views/DiscussionDetailView.vue
new file mode 100644
index 0000000..c5a9f42
--- /dev/null
+++ b/frontend/src/views/DiscussionDetailView.vue
@@ -0,0 +1,40 @@
+
+
+
+ 讨论/{{ discussion.category }}
+
+ {{ discussion.category }}
+ {{ discussion.author }}{{ discussion.views }} 次浏览
+
+
+
{{ discussion.content }}
+
diff --git a/frontend/src/views/DiscussionsView.vue b/frontend/src/views/DiscussionsView.vue
new file mode 100644
index 0000000..3ed69ef
--- /dev/null
+++ b/frontend/src/views/DiscussionsView.vue
@@ -0,0 +1,77 @@
+
+
+ 发起讨论
+
+
+ {{ c }}
+
+
+ {{ discussion.author[0] }}
+
+
+ 置顶{{ discussion.title }}
+
+
+ {{ discussion.category }}{{ discussion.author }}{{ discussion.date }}
+
+
+ {{ discussion.replies }} 回复{{ discussion.views }} 浏览
+
+
+
+
+
+ 提问时写清楚题号、语言、报错和已经尝试过的思路。分享题解时，也可以记录从哪里开始卡住，以及后来怎样找到解法。
+
+
+
- {{ c }}
+ - {{ discussions.filter((d) => d.category === c).length }} 篇示例文章
+
+
+
+
diff --git a/frontend/src/views/LogoutView.vue b/frontend/src/views/LogoutView.vue
new file mode 100644
index 0000000..59cc64c
--- /dev/null
+++ b/frontend/src/views/LogoutView.vue
@@ -0,0 +1,13 @@
+
+
+
+ 返回首页去登录
+
+
diff --git a/frontend/src/views/ProfileView.vue b/frontend/src/views/ProfileView.vue
new file mode 100644
index 0000000..f310ba8
--- /dev/null
+++ b/frontend/src/views/ProfileView.vue
@@ -0,0 +1,105 @@
+
+
+
+
{{ user.username[0] }}
+
+
PERSONAL PROFILE · 示例用户
+
{{ user.username }}
+
{{ user.motto }}
+
+ 算法爱好者持续练习
+
+
+
+ 查看提交关注
+
+
+
+
已通过题目
+
{{ user.solved }}示例统计
+
+
+
总提交数
+
{{ user.submissions }}示例统计
+
+
+
通过率
+
{{ Math.round((user.solved / user.submissions) * 100) }}%示例统计
+
+
+
竞赛积分
+
{{ user.rating }}示例积分
+
+
+
提交活动热力图 · 布局示例
+
+
+
+ 少← 提交活跃度 →多
+ 以下题目来自当前示例提交记录。
+
+
+
{{ user.motto }}
+
+
+
- 用户名
+ - {{ user.username }}
+
+
+
- 榜单位置
+ - #{{ rankings.indexOf(user) + 1 }}
+
+
+ 后续结合历史代码、提交结果和题目标签，分析练习情况并生成个性化训练建议。
+
+ 分析服务待接入
+
+
diff --git a/frontend/src/views/TeamsView.vue b/frontend/src/views/TeamsView.vue
new file mode 100644
index 0000000..b1a2cb0
--- /dev/null
+++ b/frontend/src/views/TeamsView.vue
@@ -0,0 +1,61 @@
+
+
+ 创建团队
+
+ 示例团队 · 加入功能待接入
+
+
+
+ {{ team.initials }}
+
+
{{ team.name }}
+
{{ team.description }}
+
+ {{ tag }}
+
+
+ {{ team.members }} 名成员 · 示例申请加入
+
+
+
From 8c3cca6fdef6b694436e2df3832238b9d2171b36 Mon Sep 17 00:00:00 2001
From: kronecker <2026692687@qq.com>
Date: Mon, 5 Oct 2026 01:50:07 +0800
Subject: [PATCH 7/8] feat(frontend): isolate admin app with sidebar navigation
Build a separate admin entrypoint with its own router and sidebar layout.
Add preview sections for problems, contests, users, judge nodes and site settings.
Configure Vite to emit both public and admin HTML entries.
---
frontend/admin/index.html | 12 ++
frontend/src/admin/AdminApp.vue | 39 +++++
frontend/src/admin/AdminView.vue | 272 +++++++++++++++++++++++++++++++
frontend/src/admin/main.ts | 10 ++
frontend/src/admin/navigation.ts | 8 +
frontend/src/admin/router.ts | 12 ++
frontend/vite.config.ts | 9 +
7 files changed, 362 insertions(+)
create mode 100644 frontend/admin/index.html
create mode 100644 frontend/src/admin/AdminApp.vue
create mode 100644 frontend/src/admin/AdminView.vue
create mode 100644 frontend/src/admin/main.ts
create mode 100644 frontend/src/admin/navigation.ts
create mode 100644 frontend/src/admin/router.ts
diff --git a/frontend/admin/index.html b/frontend/admin/index.html
new file mode 100644
index 0000000..ad457f0
--- /dev/null
+++ b/frontend/admin/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+
KF 管理控制台
+
+
+
+
+
+
diff --git a/frontend/src/admin/AdminApp.vue b/frontend/src/admin/AdminApp.vue
new file mode 100644
index 0000000..3c81b9f
--- /dev/null
+++ b/frontend/src/admin/AdminApp.vue
@@ -0,0 +1,39 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/admin/AdminView.vue b/frontend/src/admin/AdminView.vue
new file mode 100644
index 0000000..c6535b7
--- /dev/null
+++ b/frontend/src/admin/AdminView.vue
@@ -0,0 +1,272 @@
+
+
+ 返回站点
+
+
+
+ 前端预览待接入待接入待接入
+
新建题目草稿
+
+
+
+ 编辑预览查看
+
创建比赛
+
+
+
+ 查看
+
+
+
+ 用户查看主页修改角色
+
实际节点、负载、心跳和任务状态将在协调器接口接入后展示。
+ {{
+ row.status
+ }}暂停接单
+
+
+
+ 保存设置当前编辑只在本页面预览
+
+
+
+
题面编辑、测试数据和版本发布将在题库接口接入后启用。
关闭预览保存题目
+
diff --git a/frontend/src/admin/main.ts b/frontend/src/admin/main.ts
new file mode 100644
index 0000000..49dfc10
--- /dev/null
+++ b/frontend/src/admin/main.ts
@@ -0,0 +1,10 @@
+import { createApp } from 'vue'
+import { registerUi } from '../plugins/ui'
+import { adminRouter } from './router'
+import AdminApp from './AdminApp.vue'
+import '../styles/base.css'
+import '../styles/blueprint.css'
+
+const app = createApp(AdminApp)
+registerUi(app)
+app.use(adminRouter).mount('#admin-app')
diff --git a/frontend/src/admin/navigation.ts b/frontend/src/admin/navigation.ts
new file mode 100644
index 0000000..9d70ebf
--- /dev/null
+++ b/frontend/src/admin/navigation.ts
@@ -0,0 +1,8 @@
+export const adminSections = [
+ { id: 'overview', title: '概览', icon: 'monitor' },
+ { id: 'problems', title: '题目管理', icon: 'problems' },
+ { id: 'contests', title: '比赛管理', icon: 'contests' },
+ { id: 'users', title: '用户管理', icon: 'teams' },
+ { id: 'judges', title: '判题节点', icon: 'connection' },
+ { id: 'settings', title: '站点设置', icon: 'settings' },
+]
diff --git a/frontend/src/admin/router.ts b/frontend/src/admin/router.ts
new file mode 100644
index 0000000..eac06de
--- /dev/null
+++ b/frontend/src/admin/router.ts
@@ -0,0 +1,12 @@
+import { createRouter, createWebHashHistory } from 'vue-router'
+import { adminSections } from './navigation'
+
+export const adminRouter = createRouter({
+ history: createWebHashHistory('/admin/index.html'),
+ scrollBehavior: () => ({ top: 0 }),
+ routes: [{ path: '/:section?', component: () => import('./AdminView.vue') }],
+})
+adminRouter.afterEach((to) => {
+ const section = adminSections.find((item) => item.id === (to.params.section || 'overview'))
+ document.title = `${section?.title ?? '页面不存在'} · KF 管理控制台`
+})
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index cacb854..a5b61e3 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -1,10 +1,19 @@
import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
+import { fileURLToPath, URL } from 'node:url'
export default defineConfig(({ mode }) => {
const env = loadEnv(mode, process.cwd(), '')
return {
plugins: [vue()],
+ build: {
+ rollupOptions: {
+ input: {
+ main: fileURLToPath(new URL('./index.html', import.meta.url)),
+ admin: fileURLToPath(new URL('./admin/index.html', import.meta.url)),
+ },
+ },
+ },
server: {
port: 5173,
strictPort: true,
From f108e88c47e6d604184d8a34dfd39be06762e159 Mon Sep 17 00:00:00 2001
From: kronecker <2026692687@qq.com>
Date: Mon, 5 Oct 2026 15:26:41 +0800
Subject: [PATCH 8/8] fix(frontend): save pending code drafts before page exit
---
Makefile | 1 +
frontend/README.md | 3 +
frontend/package.json | 1 +
frontend/src/composables/useCodeDraft.ts | 15 ++-
frontend/tests/useCodeDraft.test.ts | 164 +++++++++++++++++++++++
frontend/tsconfig.json | 3 +-
6 files changed, 184 insertions(+), 3 deletions(-)
create mode 100644 frontend/tests/useCodeDraft.test.ts
diff --git a/Makefile b/Makefile
index 441d684..83679b0 100644
--- a/Makefile
+++ b/Makefile
@@ -43,6 +43,7 @@ check-frontend:
cd frontend && $(PNPM) lint
cd frontend && $(PNPM) format:check
cd frontend && $(PNPM) typecheck
+ cd frontend && $(PNPM) test
cd frontend && $(PNPM) build
contracts:
diff --git a/frontend/README.md b/frontend/README.md
index 19dc9a2..3cc7779 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -7,6 +7,7 @@ Vue 3 + TypeScript + Vite + Element Plus，使用 Vue Router 与 Pinia。
pnpm install --frozen-lockfile
pnpm dev
pnpm typecheck
+pnpm test
pnpm build
```
@@ -22,3 +23,5 @@ pnpm build
已有代码按实际需要落位；`components/` 和 `stores/` 是后续扩展位置，不放空状态实现。
API 类型更新执行根目录 `make contracts`；前端通过 `pnpm check:api` 拒绝过期类型。
登录凭据、模型密钥和数据库连接不能进入 `VITE_` 环境变量。
+
+`pnpm test` 验证代码草稿在刷新、切到后台与页面离开时的保存行为，已纳入 `make check-frontend`。
diff --git a/frontend/package.json b/frontend/package.json
index 59b7459..58f7e6c 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,6 +12,7 @@
"build": "vue-tsc --noEmit && vite build",
"preview": "vite preview --host 127.0.0.1",
"typecheck": "vue-tsc --noEmit",
+ "test": "node --test tests/*.test.ts",
"lint": "eslint . --max-warnings 0",
"format": "prettier --write .",
"format:check": "prettier --check .",
diff --git a/frontend/src/composables/useCodeDraft.ts b/frontend/src/composables/useCodeDraft.ts
index f1ac72a..f1c17c7 100644
--- a/frontend/src/composables/useCodeDraft.ts
+++ b/frontend/src/composables/useCodeDraft.ts
@@ -67,11 +67,22 @@ export function useCodeDraft(problemId: string) {
clearTimeout(timer)
timer = setTimeout(save, 400)
},
- { deep: true },
+ // Mark pending changes before a lifecycle event can run in the same tick.
+ { deep: true, flush: 'sync' },
)
- onScopeDispose(() => {
+ function flushPendingDraft() {
if (state.value === 'changed') save()
+ }
+ function onVisibilityChange() {
+ if (document.visibilityState === 'hidden') flushPendingDraft()
+ }
+ window.addEventListener('pagehide', flushPendingDraft)
+ document.addEventListener('visibilitychange', onVisibilityChange)
+ onScopeDispose(() => {
+ flushPendingDraft()
clearTimeout(timer)
+ window.removeEventListener('pagehide', flushPendingDraft)
+ document.removeEventListener('visibilitychange', onVisibilityChange)
})
return { language, code, state, save }
}
diff --git a/frontend/tests/useCodeDraft.test.ts b/frontend/tests/useCodeDraft.test.ts
new file mode 100644
index 0000000..b2cc75a
--- /dev/null
+++ b/frontend/tests/useCodeDraft.test.ts
@@ -0,0 +1,164 @@
+import assert from 'node:assert/strict'
+import { test, type TestContext } from 'node:test'
+import { effectScope, nextTick } from 'vue'
+import { codeTemplates, useCodeDraft, type Language } from '../src/composables/useCodeDraft.ts'
+
+type SavedDraft = { version: number; language: Language; drafts: Record
}
+
+function browser(t: TestContext) {
+ const page = new EventTarget()
+ const document = Object.assign(new EventTarget(), {
+ visibilityState: 'visible' as DocumentVisibilityState,
+ })
+ const storage = {
+ items: new Map(),
+ writes: 0,
+ failWrites: false,
+ getItem(key: string) {
+ return this.items.get(key) ?? null
+ },
+ setItem(key: string, value: string) {
+ this.writes++
+ if (this.failWrites) throw new Error('Storage unavailable')
+ this.items.set(key, value)
+ },
+ }
+ const globals = { window: page, document, localStorage: storage }
+ const descriptors = Object.keys(globals).map(
+ (name) => [name, Object.getOwnPropertyDescriptor(globalThis, name)] as const,
+ )
+ for (const [name, value] of Object.entries(globals)) {
+ Object.defineProperty(globalThis, name, { configurable: true, writable: true, value })
+ }
+ t.mock.timers.enable({ apis: ['setTimeout'] })
+ const scopes: ReturnType[] = []
+ t.after(() => {
+ for (const scope of scopes) scope.stop()
+ for (const [name, descriptor] of descriptors) {
+ if (descriptor) Object.defineProperty(globalThis, name, descriptor)
+ else Reflect.deleteProperty(globalThis, name)
+ }
+ })
+ return {
+ page,
+ document,
+ storage,
+ open(problemId = '1001') {
+ const scope = effectScope()
+ scopes.push(scope)
+ return { scope, ...scope.run(() => useCodeDraft(problemId))! }
+ },
+ read(problemId = '1001'): SavedDraft | null {
+ return JSON.parse(storage.getItem('kf-oj:code-draft:' + problemId) ?? 'null')
+ },
+ }
+}
+
+test('pagehide saves the latest edit before the debounce and restores it after reload', (t) => {
+ const env = browser(t)
+ const draft = env.open()
+ draft.code.value = '// latest edit before refresh'
+ env.page.dispatchEvent(new Event('pagehide'))
+ assert.equal(env.read()?.drafts.cpp, draft.code.value)
+ assert.equal(draft.state.value, 'saved')
+ t.mock.timers.tick(400)
+ assert.equal(env.storage.writes, 1)
+ draft.scope.stop()
+ assert.equal(env.open().code.value, '// latest edit before refresh')
+})
+
+test('hiding the page flushes pending edits; remaining visible does not', async (t) => {
+ const env = browser(t)
+ const draft = env.open()
+ draft.code.value = '// edited while visible'
+ await nextTick()
+ env.document.dispatchEvent(new Event('visibilitychange'))
+ assert.equal(env.storage.writes, 0)
+ env.document.visibilityState = 'hidden'
+ env.document.dispatchEvent(new Event('visibilitychange'))
+ assert.equal(env.read()?.drafts.cpp, draft.code.value)
+ t.mock.timers.tick(400)
+ assert.equal(env.storage.writes, 1)
+})
+
+test('normal typing still debounces writes and saves the most recent edit', async (t) => {
+ const env = browser(t)
+ const draft = env.open()
+ draft.code.value = '// first edit'
+ await nextTick()
+ t.mock.timers.tick(399)
+ assert.equal(env.storage.writes, 0)
+ draft.code.value = '// second edit'
+ await nextTick()
+ t.mock.timers.tick(399)
+ assert.equal(env.storage.writes, 0)
+ t.mock.timers.tick(1)
+ assert.equal(env.read()?.drafts.cpp, '// second edit')
+ assert.equal(env.storage.writes, 1)
+})
+
+test('leaving a Vue page saves even an edit made in the same tick', (t) => {
+ const env = browser(t)
+ const draft = env.open()
+ draft.code.value = '// latest edit before navigation'
+ draft.scope.stop()
+ assert.equal(env.read()?.drafts.cpp, '// latest edit before navigation')
+ t.mock.timers.tick(400)
+ assert.equal(env.storage.writes, 1)
+})
+
+test('disposing the scope removes page lifecycle listeners', (t) => {
+ const env = browser(t)
+ const removePage = t.mock.method(env.page, 'removeEventListener')
+ const removeDocument = t.mock.method(env.document, 'removeEventListener')
+ env.open().scope.stop()
+ assert.deepEqual(
+ removePage.mock.calls.map((call) => call.arguments[0]),
+ ['pagehide'],
+ )
+ assert.deepEqual(
+ removeDocument.mock.calls.map((call) => call.arguments[0]),
+ ['visibilitychange'],
+ )
+ env.page.dispatchEvent(new Event('pagehide'))
+ env.document.visibilityState = 'hidden'
+ env.document.dispatchEvent(new Event('visibilitychange'))
+ assert.equal(env.storage.writes, 0)
+})
+
+test('pagehide preserves the selected language and keeps problem drafts separate', (t) => {
+ const env = browser(t)
+ const first = env.open('1001')
+ first.code.value = '// C++ draft'
+ first.language.value = 'python'
+ first.code.value = '# Python draft'
+ const second = env.open('1002')
+ second.code.value = '// another problem'
+ env.page.dispatchEvent(new Event('pagehide'))
+ assert.deepEqual(env.read('1001'), {
+ version: 1,
+ language: 'python',
+ drafts: { cpp: '// C++ draft', python: '# Python draft', rust: codeTemplates.rust },
+ })
+ assert.equal(env.read('1002')?.drafts.cpp, '// another problem')
+ first.scope.stop()
+ const restored = env.open('1001')
+ assert.equal(restored.language.value, 'python')
+ assert.equal(restored.code.value, '# Python draft')
+})
+
+test('a failed lifecycle save reports unavailable storage without throwing', (t) => {
+ const env = browser(t)
+ const draft = env.open()
+ env.storage.failWrites = true
+ draft.code.value = '// cannot persist yet'
+ assert.doesNotThrow(() => env.page.dispatchEvent(new Event('pagehide')))
+ assert.equal(draft.state.value, 'unavailable')
+ t.mock.timers.tick(400)
+ assert.equal(env.storage.writes, 1)
+ env.storage.failWrites = false
+ draft.code.value = '// storage recovered'
+ env.page.dispatchEvent(new Event('pagehide'))
+ assert.equal(draft.state.value, 'saved')
+ assert.equal(env.read()?.drafts.cpp, '// storage recovered')
+})
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index a216dce..2f52f31 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -6,6 +6,7 @@
"moduleResolution": "Bundler",
"strict": true,
"noEmit": true,
+ "allowImportingTsExtensions": true,
"skipLibCheck": true,
"esModuleInterop": true,
"resolveJsonModule": true,
@@ -15,5 +16,5 @@
"noUnusedParameters": true,
"types": ["vite/client", "node"]
},
- "include": ["src/**/*.ts", "src/**/*.vue", "vite.config.ts"]
+ "include": ["src/**/*.ts", "src/**/*.vue", "tests/**/*.ts", "vite.config.ts"]
}