Kundenansicht neu P7: gemeinsame Bausteine der Bestellseiten (Block, Linkzeile, Kundenart-Zeile)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

test/knAnsichtQuelltext.test.js

@@ -6,7 +6,7 @@ import { fileURLToPath } from 'node:url'
 
 const WURZEL = path.join(path.dirname(fileURLToPath(import.meta.url)), '..')
 const NEU = path.join(WURZEL, 'public', 'neu')
-const MODULE = ['ansicht-hilfen', 'rechnung-offen', 'install-hinweis', 'website-details', 'ansicht-website', 'ansicht-chat', 'ansicht-vertraege', 'vertraege-rechnungen', 'vertraege-abo', 'ansicht-stunden', 'ansicht-speicher', 'ansicht-bestellen', 'ansicht-wechsel', 'ansicht-gutschrift', 'ansicht-passwort']
+const MODULE = ['ansicht-hilfen', 'rechnung-offen', 'install-hinweis', 'website-details', 'ansicht-website', 'ansicht-chat', 'ansicht-vertraege', 'vertraege-rechnungen', 'vertraege-abo', 'ansicht-stunden', 'ansicht-speicher', 'ansicht-bestellen', 'ansicht-wechsel', 'ansicht-gutschrift', 'ansicht-passwort', 'bestell-bausteine']
 const WORTLAUT = ['ansicht-speicher', 'ansicht-bestellen', 'ansicht-wechsel', 'ansicht-gutschrift']
 const vorhanden = MODULE.filter((n) => existsSync(path.join(NEU, `${n}.js`)))
 

test/knAnsichtStil.test.js

@@ -6,7 +6,7 @@ import { K } from '../public/neu/ansicht-hilfen.js'
 const css = (f) => readFileSync(new URL(`../public/neu/${f}`, import.meta.url), 'utf8')
 const lese = (p) => readFileSync(new URL(`../public/${p}`, import.meta.url), 'utf8')
 const A = css('ansichten.css'); const O = css('oeffentlich/oeffentlich.css'); const C = css('chat-composer.css'); const BASIS = css('basis.css'); const TOKENS = css('tokens.css')
-const MODULE = ['ansicht-hilfen', 'rechnung-offen', 'install-hinweis', 'website-details', 'ansicht-website', 'ansicht-chat', 'ansicht-vertraege', 'vertraege-rechnungen', 'vertraege-abo', 'ansicht-stunden', 'ansicht-speicher', 'ansicht-bestellen', 'ansicht-wechsel', 'ansicht-gutschrift', 'ansicht-passwort']
+const MODULE = ['ansicht-hilfen', 'rechnung-offen', 'install-hinweis', 'website-details', 'ansicht-website', 'ansicht-chat', 'ansicht-vertraege', 'vertraege-rechnungen', 'vertraege-abo', 'ansicht-stunden', 'ansicht-speicher', 'ansicht-bestellen', 'ansicht-wechsel', 'ansicht-gutschrift', 'ansicht-passwort', 'bestell-bausteine']
 const existiert = (n) => existsSync(new URL(`../public/neu/${n}.js`, import.meta.url))
 const lies = (n) => css(`${n}.js`).replace(/\/\*[\s\S]*?\*\//g, '')
 const VERBOTEN = /linear-gradient|radial-gradient|conic-gradient|backdrop-filter|prefers-color-scheme:\s*dark|font-weight:\s*800|#9d3dfe|rgba?\(\s*157\s*,\s*61/i

test/knBestellBausteine.test.js

@@ -0,0 +1,62 @@
+import { test } from 'node:test'
+import assert from 'node:assert/strict'
+import { readFileSync } from 'node:fs'
+import { mitDom } from './support/knDaten.js'
+import { TERMS_URL, meMit, aboNeu } from './support/knBestellDaten.js'
+import { kundenartVon, sicherLink, linkTeile, baueLinkzeile, baueKundenartZeile, baueBlock, hatWortlaut } from '../public/neu/bestell-bausteine.js'
+
+test('kundenartVon: nur exakt unternehmen ist Betrieb (E4)', () => {
+  for (const m of [undefined, null, {}, { customer: {} }, meMit(''), meMit('privat'), { customer: { kundenartWirksam: 'Unternehmen' } }, { customer: { kundenart: 'unternehmen' } }]) {
+    assert.equal(kundenartVon(m), 'privat')
+  }
+  assert.equal(kundenartVon(meMit('unternehmen')), 'unternehmen')
+  assert.equal(kundenartVon({}, { kundenart: 'unternehmen' }), 'unternehmen')
+  assert.equal(kundenartVon({}, { kundenart: 'Unternehmen' }), 'privat')
+})
+
+test('sicherLink', () => {
+  for (const ok of ['/datenschutz.html', `${TERMS_URL}#zusatzspeicher`, '#chat', '#gutschrift?bedingungen=1', 'https://example.invalid/x']) assert.equal(sicherLink(ok), ok)
+  for (const schlecht of ['javascript:alert(1)', '//evil.example/x', '/\\evil.example', 'data:text/html,x', 'http:/x', 'abo.html', '', undefined, null, 42, '/a b', '#', '# chat', 'https://', 'https://user:pw@example.invalid/']) {
+    assert.equal(sicherLink(schlecht), '', String(schlecht))
+  }
+})
+
+test('linkTeile: Markierungen werden der Reihe nach Links, Unsicheres bleibt Text', () => {
+  assert.deepEqual(linkTeile('Es gilt [A] und [B].', ['/a', '/b']), [{ text: 'Es gilt ' }, { text: 'A', href: '/a' }, { text: ' und ' }, { text: 'B', href: '/b' }, { text: '.' }])
+  assert.deepEqual(linkTeile('Siehe [A].', ['javascript:x']), [{ text: 'Siehe ' }, { text: 'A' }, { text: '.' }])
+  assert.deepEqual(linkTeile('Nur Text', []), [{ text: 'Nur Text' }])
+  assert.deepEqual(linkTeile('Offen [A', ['/a']), [{ text: 'Offen [A' }])
+  assert.deepEqual(linkTeile('[A] [B]', ['/a']), [{ text: 'A', href: '/a' }, { text: ' ' }, { text: 'B' }], 'fehlende Adresse: Text')
+  assert.deepEqual(linkTeile(undefined, undefined), [])
+})
+
+test('baueLinkzeile, baueKundenartZeile, baueBlock', () =>
+  mitDom((fx) => {
+    const p = baueLinkzeile({ text: 'Siehe [A] und [B].', urls: ['/a', '#chat'] }, { id: 'x' })
+    const [a, b] = fx.alle(p, 'a')
+    assert.deepEqual([p.id, fx.text(p), a.getAttribute('target'), a.getAttribute('rel'), b.getAttribute('target')], ['x', 'Siehe A und B.', '_blank', 'noopener', null])
+    const T = aboNeu().bestelltexte.kundenart
+    assert.equal(fx.text(baueKundenartZeile('unternehmen', T, { id: 'k' })), 'Du bestellst als Betrieb · Stimmt nicht? Schreib uns im Chat')
+    assert.equal(fx.text(baueKundenartZeile('privat', T, { id: 'k' })), 'Du bestellst privat · Stimmt nicht? Schreib uns im Chat')
+    assert.equal(fx.text(baueKundenartZeile('kaputt', T, { id: 'k' })), 'Du bestellst privat · Stimmt nicht? Schreib uns im Chat')
+    assert.equal(fx.finde(baueKundenartZeile('privat', T, { id: 'k' }), 'a').getAttribute('href'), '#chat')
+    const dl = baueBlock([{ id: 'r1', label: 'Preis', text: '<b>50</b>' }], { id: 'blk' })
+    assert.deepEqual([fx.alle(dl, 'dt').length, fx.finde(dl, 'dd').textContent, fx.finde(dl, 'b'), fx.finde(dl, '#r1').textContent], [1, '<b>50</b>', null, '<b>50</b>'])
+    assert.deepEqual([dl.tagName, dl.id, dl.className], ['DL', 'blk', 'kn-block'])
+    // eine unsichere Adresse macht keinen Link
+    assert.equal(fx.alle(baueLinkzeile({ text: 'Siehe [A].', urls: ['javascript:alert(1)'] }, { id: 'y' }), 'a').length, 0)
+    // keine h1 in den Bausteinen
+    for (const el of [p, dl, baueKundenartZeile('privat', T, { id: 'k' })]) assert.equal(fx.alle(el, 'h1').length, 0)
+  }))
+
+test('hatWortlaut', () => {
+  assert.equal(hatWortlaut(aboNeu()), true)
+  for (const d of [null, undefined, {}, { bestelltexte: {} }, { bestelltexte: { status: 'entwurf', knopf: 'x' } }, { bestelltexte: { status: 'entwurf', abo: { linkzeile: { text: 'a' } } } }]) assert.equal(hatWortlaut(d), false)
+})
+
+test('Quelltext: keine HTML-Einsetzung, Du-Form, keine h1', () => {
+  const q = readFileSync(new URL('../public/neu/bestell-bausteine.js', import.meta.url), 'utf8').replace(/\/\*[\s\S]*?\*\//g, '')
+  assert.doesNotMatch(q, /innerHTML|insertAdjacentHTML|outerHTML|document\.write/)
+  assert.doesNotMatch(q, /\b(Sie|Ihr(e[nmrs]?)?|Ihnen)\b/)
+  assert.doesNotMatch(q, /'h1'/)
+})

test/support/knBestellDaten.js

@@ -0,0 +1,18 @@
+// Testdaten der Bestellseiten (P7, Fassung 6): die Fassung und die Adresse der Bedingungen kommen aus Konfiguration und Tabelle,
+// nie als Literal; der Wortlaut aus bestelltexteFuerClient (wie GET /api/abo ihn in der neuen Ansicht liefert).
+import { config } from '../../server/config.js'
+import { termsDocFor } from '../../server/services/products.js'
+import { bestelltexteFuerClient } from '../../server/services/bestelltexte.js'
+import { me, aboAntwort } from './knDaten.js'
+
+export const NEU = config.abo.termsVersionNeu
+export const TERMS_URL = termsDocFor(NEU).url
+
+/** me(over) mit customer.kundenart und customer.kundenartWirksam; bei '' bleibt die gespeicherte Angabe leer. */
+export const meMit = (kundenartWirksam, over = {}) => {
+  const { customer = {}, ...rest } = over
+  return me({ ...rest, customer: { kundenart: kundenartWirksam === '' ? '' : kundenartWirksam, kundenartWirksam, ...customer } })
+}
+
+/** Ganze Antwort von GET /api/abo in der neuen Ansicht: Fassung 6 und Wortlaut. */
+export const aboNeu = (over = {}) => aboAntwort({ termsVersion: NEU, bestelltexte: bestelltexteFuerClient({ fassung: NEU, termsUrl: TERMS_URL }), ...over })