refactor: 收口公共AppBar组件

scripts/tests/message-page-source.test.cjs

@@ -0,0 +1,45 @@
+const assert = require("node:assert/strict");
+const fs = require("node:fs");
+const path = require("node:path");
+
+const messagePageStyles = fs.readFileSync(
+  path.join(__dirname, "../../src/pages/message/index.scss"),
+  "utf8"
+);
+const messagePageSource = fs.readFileSync(
+  path.join(__dirname, "../../src/pages/message/index.tsx"),
+  "utf8"
+);
+
+function run(name, fn) {
+  try {
+    fn();
+    console.log(`PASS ${name}`);
+  } catch (error) {
+    console.error(`FAIL ${name}`);
+    throw error;
+  }
+}
+
+run("message tabs container spans full width without manual gap spacing", () => {
+  assert.match(messagePageStyles, /\.message-tabs\s*\{[\s\S]*width:\s*100%;/);
+  assert.doesNotMatch(messagePageStyles, /\.message-tabs\s*\{[\s\S]*gap:\s*110rpx;/);
+});
+
+run("each message tab item takes half of the row", () => {
+  assert.match(messagePageStyles, /\.message-tabs__item\s*\{[\s\S]*flex:\s*1;/);
+  assert.match(messagePageStyles, /\.message-tabs__item\s*\{[\s\S]*min-width:\s*0;/);
+});
+
+run("message tab label and unread dot are grouped in a centered content wrapper", () => {
+  assert.match(messagePageSource, /className="message-tabs__content"/);
+  assert.match(messagePageStyles, /\.message-tabs__content\s*\{[\s\S]*display:\s*inline-flex;/);
+});
+
+run("message tabs are rendered below AppBar instead of inside bottomSlot", () => {
+  assert.doesNotMatch(messagePageSource, /bottomSlot=\{/);
+  assert.match(
+    messagePageSource,
+    /<AppBar[\s\S]*\/>\s*<View className="message-tabs">/
+  );
+});