fedipod-bb 0.4.1 → 0.4.3

package/README.md

@@ -12,11 +12,10 @@ the forum from a moderator's machine, and the page that shows the forum.
 A moderator's console is part of that page: the queue of reports, held posts
 and asks, and the settings.
 The queue shows what needs a moderator: a report, a held post, a join
-request, and a request of a moderator's that did not take. The design and the phases are in
-`claude/plans/fedipod-bb.md` at the repository root.
+request, and a request of a moderator's that did not take.
 
 ```
-node --test packages/fedipod-bb/test/*.test.mjs
+npm test
 ```
 
 ## Hosting a forum
@@ -181,7 +180,7 @@ category's address; a reader with nothing is pointed at sign-up.
 ## Attaching to a Gateway
 
 ```
-node packages/fedipod-bb/bin/fedipod-bb.mjs attach --home DIR --front https://fedipod.net
+fedipod-bb attach --home DIR --front https://fedipod.net
 ```
 
 Takes `@<handle>@fedipod.net` for the forum and one address per category,

package/package.json

@@ -1,8 +1,15 @@
 {
   "name": "fedipod-bb",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "description": "FediPod-BB: a forum website whose record lives on a Solid pod.",
   "license": "MIT",
+  "author": "Jeff Zucker",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jeff-zucker/fedipod-bb.git"
+  },
+  "homepage": "https://github.com/jeff-zucker/fedipod-bb#readme",
+  "bugs": "https://github.com/jeff-zucker/fedipod-bb/issues",
   "type": "module",
   "main": "src/index.mjs",
   "exports": {
@@ -23,11 +30,10 @@
     "fep-draft.md"
   ],
   "scripts": {
-    "pretest": "node scripts/link-fedipod.mjs",
     "test": "node --test test/*.test.mjs"
   },
   "dependencies": {
-    "fedipod": "^1.44.0",
+    "fedipod": "^1.50.2",
     "fediverse-session": "^0.2.1"
   }
 }

package/site/bb.js

@@ -10,8 +10,8 @@
 //   https://bb.<site>/<handle>/     the same forum at its own address
 //   #/  #/c/<slug>  #/t/<slug>/<tid>
 
-import { reader, placeOf, authorLabel, cacheKey, categoryBase } from './read.mjs';
-import { MastoLogin, hostOfHandle, serverKind, actorOfHandle } from './masto.mjs';
+import { reader, placeOf, authorLabel, cacheKey, categoryBase, cleanHtml } from './read.mjs';
+import { MastoLogin, hostOfHandle, serverKind, actorOfHandle, returnAddress } from './masto.mjs';
 import * as pod from './pod.mjs';
 import { mine as keptByReader } from './mine.mjs';
 import { readState } from './seen.mjs';
@@ -47,7 +47,7 @@ let freshRead = false;
 const readerFetch = (url, init = {}) => fetch(url, freshRead ? { ...init, cache: 'reload' } : init);
 const makeReader = (session = null) => reader({ session, fetch: readerFetch });
 let read = makeReader();
-const login = new MastoLogin({ storage: localStorage, redirectUri: location.origin + location.pathname + location.search });
+const login = new MastoLogin({ storage: localStorage, redirectUri: returnAddress(location.href) });
 // What this reader has already read. Theirs, in their own browser: a public
 // forum has nowhere to keep it and no business keeping it.
 const seen = base ? readState({ storage: localStorage, forum: base }) : null;
@@ -70,7 +70,7 @@ const handleOf = (cat) => {
 // A post names the category it is for, and every reader of this page is
 // already in it: the address is how it got here, not something to read.
 function body(p, cat) {
-  const html = p?.content || '';
+  const html = cleanHtml(p?.content);
   if (!cat) return html;
   const d = document.createElement('div');
   d.innerHTML = html;
@@ -297,7 +297,7 @@ async function showReplies() {
     const href = cat && tid ? `#/t/${esc(cat.slug)}/${esc(tid)}/${esc(await cacheKey(p.id))}` : '#/';
     items.push(`<li><a class="title" href="${href}">${esc(p.topicName || 'Topic')}</a>
       <div class="meta">${who ? esc(who.handle) : esc(authorLabel(p.author || ''))} · ${esc(when(p.published))}</div>
-      <article class="post"><div class="body">${p.content || ''}</div></article></li>`);
+      <article class="post"><div class="body">${cleanHtml(p.content)}</div></article></li>`);
   }
   $('main').innerHTML = `<ul class="list">${items.join('')}</ul>`;
 }
@@ -391,7 +391,7 @@ async function showWho(handleOrId) {
     const href = c && tid ? `#/t/${esc(c.slug)}/${esc(tid)}/${esc(await cacheKey(p.id))}` : '#/';
     items.push(`<li><a class="title" href="${href}">${esc(p.topicName || 'Topic')}</a>
       <div class="meta">${c ? esc(c.name) + ' · ' : ''}${esc(when(p.published))} · ▲ ${p.likes || 0} ▼ ${p.dislikes || 0}</div>
-      <article class="post"><div class="body">${p.content || ''}</div></article></li>`);
+      <article class="post"><div class="body">${cleanHtml(p.content)}</div></article></li>`);
   }
   $('main').innerHTML = head + `<ul class="list">${items.join('')}</ul>`;
 }

package/site/masto.mjs

@@ -54,6 +54,15 @@ export async function serverKind(host, front, f = globalThis.fetch.bind(globalTh
   } catch { return { kind: 'unknown', host }; }
 }
 
+// Where Mastodon sends the reader back: this page, without the sign-in's own
+// code and state. Mastodon hands out the key only for the address it approved,
+// and the page comes back with those two added, so both legs name it this way.
+export function returnAddress(href) {
+  const u = new URL(href);
+  for (const k of ['code', 'state', 'iss']) u.searchParams.delete(k);
+  return u.origin + u.pathname + u.search;
+}
+
 export class MastoLogin {
   // `storage` is localStorage-shaped; `fetch` is the page's.
   constructor({ fetch: f = globalThis.fetch.bind(globalThis), storage, redirectUri }) {

package/site/read.mjs

@@ -10,6 +10,51 @@ const MAX_PAGES = 50;
 
 export const categoryBase = (actorId) => String(actorId).replace(/ap\/actor$/u, '');
 
+// A post's text, one copy: a server that sends it once per language hands
+// over a list, read as its first.
+export function textOf(v) {
+  if (typeof v === 'string') return v;
+  if (Array.isArray(v)) return v.find(s => typeof s === 'string') || '';
+  return '';
+}
+
+// A post's text as the page shows it: only the tags and attributes a post may
+// carry (the list the forum's host keeps when it stores one), built back up
+// from a parse so nothing else reaches the page. DOMParser's parse is inert:
+// it runs no script and loads no image. `parse` is for tests.
+const KEEP = new Set(['p', 'br', 'a', 'span', 'em', 'strong', 'b', 'i', 'u', 'del',
+  'code', 'pre', 'blockquote', 'ul', 'ol', 'li', 'h1', 'h2', 'h3', 'h4']);
+const ATTRS = new Set(['href', 'class', 'lang', 'title']);
+const DROP = new Set(['script', 'style', 'textarea', 'noscript', 'template', 'title', 'head']);
+const escText = (s) => String(s).replace(/[&<>"]/g, c => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;' }[c]));
+const linkable = (href) => { try { return ['http:', 'https:', 'mailto:'].includes(new URL(href).protocol); } catch { return false; } };
+const inert = (html) => new DOMParser().parseFromString(html, 'text/html').body;
+
+function rebuild(node) {
+  let out = '';
+  for (const n of node.childNodes) {
+    if (n.nodeType === 3) { out += escText(n.nodeValue); continue; }
+    if (n.nodeType !== 1) continue;
+    const tag = n.nodeName.toLowerCase();
+    if (DROP.has(tag)) continue;
+    if (!KEEP.has(tag)) { out += rebuild(n); continue; }
+    let attrs = '';
+    for (const a of n.attributes) {
+      const name = a.name.toLowerCase();
+      if (!ATTRS.has(name) || (name === 'href' && (tag !== 'a' || !linkable(a.value)))) continue;
+      attrs += ` ${name}="${escText(a.value)}"`;
+    }
+    if (tag === 'a') attrs += ' rel="nofollow noopener noreferrer"';
+    out += tag === 'br' ? '<br>' : `<${tag}${attrs}>${rebuild(n)}</${tag}>`;
+  }
+  return out;
+}
+
+export function cleanHtml(html, parse = inert) {
+  const text = textOf(html);
+  return text ? rebuild(parse(text)) : '';
+}
+
 // Where a forum is read from: through a Gateway at `<origin>/u/<handle>/`, or
 // a pod home given outright.
 export const forumBase = ({ origin = null, handle = null, pod = null } = {}) => {
@@ -213,8 +258,8 @@ export function reader({ fetch: f = globalThis.fetch.bind(globalThis), session =
           id: copy.id || url,
 
           author: idOf([].concat(copy.attributedTo || [])[0]) || null,
-          name: copy.name || null,
-          content: typeof copy.content === 'string' ? copy.content : '',
+          name: textOf(copy.name) || null,
+          content: textOf(copy.content),
           published: copy.published || null,
           topic: idOf(copy.context) || null,
           inReplyTo: idOf(copy.inReplyTo) || null,
@@ -278,7 +323,7 @@ export function reader({ fetch: f = globalThis.fetch.bind(globalThis), session =
       return {
         id: copy.id || postId, type: copy.type || 'Note', gone: copy.type === 'Tombstone', page,
         author: idOf([].concat(copy.attributedTo || [])[0]) || null,
-        name: copy.name || null, content: typeof copy.content === 'string' ? copy.content : '',
+        name: textOf(copy.name) || null, content: textOf(copy.content),
         // What its author typed, when they said so: an edit reopens this
         // rather than guessing it back out of the HTML.
         source: copy.source?.mediaType === 'text/markdown' && typeof copy.source?.content === 'string' ? copy.source.content : null,

package/src/publish.mjs

@@ -175,6 +175,8 @@ export async function cachePost({ remote, urls }, note, { topic = null, replies
   // count beside every post it shows.
   if (Number.isFinite(likes)) copy.likes = { type: 'Collection', totalItems: likes };
   if (Number.isFinite(dislikes)) copy.dislikes = { type: 'Collection', totalItems: dislikes };
+  // One copy of the text: a server that sends it once per language hands over a list.
+  if (Array.isArray(copy.content)) copy.content = copy.content.find(s => typeof s === 'string') || '';
   if (typeof copy.content === 'string') copy.content = sanitizeHtml(copy.content);
   if (!copy['@context']) copy['@context'] = 'https://www.w3.org/ns/activitystreams';
   const url = urls.cached(note.id);