Keep DingTalk QR visible in IM panel

This commit is contained in:
xmanrui 2026-08-15 12:56:33 +08:00
parent af7e6a2296
commit 4f1cc9f219
7 changed files with 51 additions and 10 deletions

View file

@ -1,4 +1,5 @@
import assert from 'node:assert/strict';
import { readFile } from 'node:fs/promises';
import test from 'node:test';
import React from 'react';
@ -6,6 +7,8 @@ import { renderToStaticMarkup } from 'react-dom/server';
import { IMSettingsTab } from '../plugin-src/client/index.js';
const STYLES_URL = new URL('../plugin-src/client/styles.js', import.meta.url);
test('IM settings renders three compact logo channel tabs without enable switches', () => {
const markup = renderToStaticMarkup(React.createElement(IMSettingsTab, {
feishuRpcCall: async () => ({ ok: true, value: {} }),
@ -27,3 +30,15 @@ test('IM settings renders three compact logo channel tabs without enable switche
assert.doesNotMatch(markup, /dim-chevron|扫码绑定<\/small>|扫码接入<\/small>/);
assert.doesNotMatch(markup, />INSTANT MESSAGING<|>Channel<|>微信设置</);
});
test('the DingTalk QR card stacks within the narrow combined-channel panel', async () => {
const styles = await readFile(STYLES_URL, 'utf8');
assert.match(styles, /\.dim-panel \{ min-width: 0; container-type: inline-size; \}/);
assert.match(
styles,
/@container \(max-width: 680px\)[\s\S]*\.dim-panel \.ddt-qrLayout \{ grid-template-columns: minmax\(0, 1fr\); justify-items: center;/,
);
assert.match(styles, /\.dim-panel \.ddt-qrFrame, \.dim-panel \.ddt-countdown \{ width: min\(270px, 100%\); \}/);
assert.match(styles, /\.dim-panel \.ddt-qrColumn \{ width: 100%; min-width: 0; \}/);
assert.match(styles, /\.dim-panel \.ddt-qrCopy \{ width: 100%; min-width: 0; overflow-wrap: anywhere; \}/);
});