braid-text 0.5.8 → 0.5.9

package/client/simpleton.js

@@ -0,0 +1,168 @@
+// Simpleton Javascript Client
+//
+//     requires braid-http@~1.3/braid-http-client.js
+//     and      text-client.js
+
+// --- API ---
+//
+// on_update?: (update) => new_state
+//     called when a server update arrives. The update object contains:
+//       - update.patches: array of { range: [start, end], content: string }
+//           Ranges are UTF-16 indices (already converted from wire
+//           code-point offsets). Patches are sorted by range[0].
+//           For the initial snapshot, patches is [{ range: [0, 0], content: full_text }].
+//       - update.state: the new text after applying patches internally.
+//       - update.version, update.parents, update.extra_headers, etc.
+//
+//     Patches have ABSOLUTE positions — each patch's range refers to
+//     positions in the original state (before any patches in this
+//     update). When applying multiple patches sequentially, you MUST
+//     track a cumulative offset to adjust positions:
+//
+//       var offset = 0
+//       for (var p of update.patches) {
+//           apply_at(p.range[0] + offset, p.range[1] + offset, p.content)
+//           offset += p.content.length - (p.range[1] - p.range[0])
+//       }
+//
+//     Must return the new text state after applying the patches.
+//     For simple cases, just return update.state. For UI integration
+//     (e.g. textarea), apply patches to the UI and return the UI's
+//     current text (which may include absorbed local edits).
+//     If not provided, simpleton uses update.state internally.
+//
+// get_patches?: (client_state) => patches
+//     returns patches representing diff between client_state and current state,
+//     which are guaranteed to be different if this method is being called.
+//     (the default does this in a fast/simple way, finding a common prefix
+//      and suffix, but you can supply something better, or possibly keep
+//      track of patches as they come from your editor)
+//
+// content_type: used for Accept and Content-Type headers
+//
+// on_error?: (error) => void
+//     called when an error occurs (e.g., network failure, digest mismatch)
+//
+// on_online?: (is_online) => void
+//     called when the connection status changes
+//
+// on_ack?: () => void
+//     called when all outstanding PUTs have been acknowledged
+//
+// send_digests?: boolean
+//     if truthy, includes a Repr-Digest header with each PUT
+//
+// returns { changed, abort }
+//     call changed(new_state) whenever there is a local change,
+//     passing the current text. The system will call get_patches
+//     to compute the diff (or use simple_diff if get_patches is
+//     not provided).
+//     call abort() to abort the subscription.
+//
+function simpleton_client(url, {
+    get_patches,
+
+    on_update,
+    on_error,
+    on_online,
+    on_ack,
+
+    headers,                  // The user can pass in custom headers
+                              // that are forwarded into fetches
+    content_type,
+    send_digests
+}) {
+    var peer = Math.random().toString(36).slice(2)
+    var client_version = []          // sorted version strings
+    var client_state = ""            // text as of client_version
+    var char_counter = -1            // char-delta for version IDs
+    var is_online = false
+    var outstanding_puts = 0
+    var pending_state = null         // non-null means dirty (unsent local edits)
+
+    // extend the headers with merge-type and peer
+    headers = { ...headers, "Merge-Type": "simpleton", Peer: peer }
+
+    var channel = reliable_update_channel(url, {
+        reconnect_from_parents: () => client_version.length ? client_version : null,
+        get_headers: { ...headers, ...content_type && {Accept: content_type} },
+        put_headers: { ...headers, ...content_type && {"Content-Type": content_type} },
+        on_update: async update => {
+            update.parents.sort()
+            if (pending_state === null && versions_eq(client_version, update.parents))
+                await apply_update(update)
+        },
+        on_status: status => {
+            is_online = status.online
+            outstanding_puts = status.outstanding_puts
+            if (on_online) on_online(is_online)
+            if (on_ack && outstanding_puts === 0) on_ack()
+            if (pending_state !== null && is_online && outstanding_puts < 10) {
+                if (pending_state === client_state) {
+                    // this is a special case where the user made changes
+                    // while offline (or too many outstanding_puts),
+                    // but then reverted those changes,
+                    // so we might have missed some updates that we could have applied;
+                    // reconnecting will fetch those updates
+                    pending_state = null
+                    channel.reconnect()
+                } else {
+                    try_send(pending_state)
+                }
+            }
+        },
+        on_error: err => on_error && on_error(err),
+        no_retry_status_codes: [550]
+    })
+
+    async function apply_update(update) {
+        update.patches = text_parse_update(update, client_state)
+        update.state = text_apply_patches(client_state, update.patches)
+
+        client_state = on_update ? on_update(update) : update.state
+
+        client_version = update.version
+        await check_digest(update, client_state)
+    }
+
+    function try_send(new_state) {
+        var patches = get_patches ? get_patches(client_state) :
+            [simple_diff(client_state, new_state)]
+
+        // Temporary: save JS-index patches to return for cursor support.
+        // We're thinking of removing this.
+        var js_patches = patches.map(p => ({range: [...p.range], content: p.content}))
+
+        var prepared = text_prepare_put(patches, client_state)
+        char_counter += prepared.version_count
+
+        var version = [peer + "-" + char_counter]
+        var parents = client_version
+        client_version = version
+        client_state = new_state
+        pending_state = null
+
+        var update = { version, parents, patches: prepared.patches }
+        if (send_digests)
+            get_digest(client_state).then(digest =>
+                channel.put({ ...update, headers: { "Repr-Digest": digest } }))
+        else
+            channel.put(update)
+
+        return js_patches // temporary, for cursor support
+    }
+
+    return {
+        abort: () => channel.close(),
+        changed: (new_state) => {
+            if (is_online && outstanding_puts < 10)
+                return try_send(new_state) // temporary, returns patches for cursor support
+            else
+                pending_state = new_state
+        }
+    }
+
+    function versions_eq(a, b) {
+        return a.length === b.length && a.every((v, i) => v === b[i])
+    }
+}

package/client/syncarea.js

@@ -0,0 +1,221 @@
+// ============================================================
+// <synced-textarea> — a textarea wired to a braid-http resource
+// ============================================================
+//
+// A drop-in replacement for <textarea> that stays in sync with a
+// braid-http resource.
+//
+// Depends on braid-http-client.js, simpleton.js, cursor-sync.js,
+// textarea-highlights.js, and text-client.js.
+//
+// Attributes:
+//   src     — the URL to sync to
+//   cursors — sync cursors too (default: true; set cursors="false" to disable)
+//   bearer  — Bearer token for servers using "Authorization: Bearer X" headers
+//
+// The following attributes are relayed to the inner textarea:
+//   placeholder, readonly, rows, cols, wrap, spellcheck, autofocus,
+//   disabled, aria-label, aria-labelledby, aria-describedby
+//
+// Changes to src, cursors, or bearer restart the sync.
+// Changes to any other attribute are just forwarded to the inner textarea.
+//
+// You can always manipulate the inner textarea directly via the .textarea property.
+
+
+// Attributes in this list restart the sync when they change.
+const CONNECTION_ATTRS = ['src', 'bearer', 'cursors']
+
+// Attributes in this list are relayed straight to the inner textarea.
+const FORWARD_ATTRS = ['placeholder', 'readonly', 'rows', 'cols',
+                       'wrap', 'spellcheck', 'autofocus',
+                       'aria-label', 'aria-labelledby', 'aria-describedby']
+
+
+class SyncedTextarea extends HTMLElement {
+
+    static observedAttributes = [...CONNECTION_ATTRS, ...FORWARD_ATTRS, 'disabled']
+
+    // DOM lifecycle hooks — dispatched to the methods in the sections below.
+    connectedCallback()    { this.connect()    }
+    disconnectedCallback() { this.disconnect() }
+    attributeChangedCallback(name, oldValue, newValue) {
+        if (!this.isConnected || oldValue === newValue) return
+        if (CONNECTION_ATTRS.includes(name)) {
+            this.disconnect()
+            this.connect()
+        } else if (name === 'disabled')
+            this.update_disabled()
+        else
+            this.forward_attribute(name)
+    }
+
+
+    // ════════════════════════════════════════════════════════════
+    //  Syncing the textarea
+    // ════════════════════════════════════════════════════════════
+
+    // Builds the inner textarea, wires up events, starts simpleton_client
+    // and cursor_highlights if enabled.
+    connect() {
+        if (this.firstChild)
+            console.warn('<synced-textarea> ignoring existing child content')
+        while (this.firstChild) this.removeChild(this.firstChild)
+
+        // Create the inner textarea, and fill the outer element with it.
+        var textarea = document.createElement('textarea')
+        textarea.style.width = '100%'
+        textarea.style.height = '100%'
+        textarea.style.boxSizing = 'border-box'
+        this.appendChild(textarea)
+        this.textarea = textarea
+
+        // Mirror all pass-through attributes to the inner textarea.
+        for (var attr of FORWARD_ATTRS) this.forward_attribute(attr)
+
+        // Start disabled until we receive the first update from the server,
+        // so the user can't type before we know what they're editing.
+        this.waiting_for_first_update = true
+        this.has_error = false
+        this.update_disabled()
+
+        // Re-dispatch the inner textarea's focus/blur events on the outer,
+        // so listeners on <synced-textarea> see them.
+        textarea.addEventListener('focus', () =>
+            this.dispatchEvent(new FocusEvent('focus')))
+        textarea.addEventListener('blur', () =>
+            this.dispatchEvent(new FocusEvent('blur')))
+
+        // When a <label for="x"> targets us, the browser fires a click on
+        // us. Forward focus to the inner textarea.
+        this.addEventListener('click', (e) => {
+            if (e.target === this) textarea.focus()
+        })
+
+        // Nothing to sync if there's no src.
+        var url = this.getAttribute('src')
+        if (!url) return
+
+        // Headers for all requests.
+        var headers = {}
+        var bearer = this.getAttribute('bearer')
+        if (bearer) headers['Authorization'] = 'Bearer ' + bearer
+
+        // Cursor sync defaults to on; set cursors="false" to disable.
+        var cursors = this.getAttribute('cursors') !== 'false'
+            ? cursor_highlights(textarea, url, { headers }) : null
+        this.cursors = cursors
+
+        // The main sync client.
+        this.client = simpleton_client(url, {
+            headers,
+            on_online: (online) => { online ? cursors?.online() : cursors?.offline() },
+            on_update: (update) => {
+                this.waiting_for_first_update = false
+                this.update_disabled()
+                apply_patches_and_update_selection(textarea, update.patches)
+                cursors?.on_patches(update.patches)
+                this.dispatchEvent(new CustomEvent('remoteupdate', { detail: { patches: update.patches } }))
+                this.dispatchEvent(new CustomEvent('update',       { detail: { patches: update.patches } }))
+                return textarea.value
+            },
+            get_patches: (prev) => diff(prev, textarea.value),
+            on_error:    () => {
+                this.has_error = true
+                this.update_disabled()
+                set_error_state(textarea)
+            },
+            on_ack:      () => set_acked_state(textarea)
+        })
+
+        // Local edits get relayed to the client and cursors.
+        this.oninput_handler = () => {
+            set_acked_state(textarea, false)
+            var patches = this.client.changed(textarea.value)
+            cursors?.on_edit(patches)
+            this.dispatchEvent(new CustomEvent('update', { detail: { patches } }))
+        }
+        textarea.addEventListener('input', this.oninput_handler)
+    }
+
+    // Tear everything down.
+    disconnect() {
+        this.client?.abort()
+        this.cursors?.destroy()
+        if (this.textarea) {
+            this.textarea.removeEventListener('input', this.oninput_handler)
+            this.textarea.remove()
+        }
+        this.client = this.cursors = this.textarea = this.oninput_handler = null
+        this.waiting_for_first_update = this.has_error = false
+    }
+
+
+    // ════════════════════════════════════════════════════════════
+    //  Emulating an inner textarea with the outer sync-textarea
+    // ════════════════════════════════════════════════════════════
+    //  So code that works with a <textarea> works with us too — the
+    //  same properties, methods, and events should behave identically.
+
+    // Attribute forwarding — mirrors attrs from outer to inner textarea.
+    forward_attribute(name) {
+        if (!this.textarea) return
+        if (this.hasAttribute(name))
+            this.textarea.setAttribute(name, this.getAttribute(name))
+        else
+            this.textarea.removeAttribute(name)
+    }
+
+    // Effective disabled state = user's `disabled` attribute OR our own
+    // internal state (still connecting, or erroring).
+    update_disabled() {
+        if (!this.textarea) return
+        this.textarea.disabled = this.hasAttribute('disabled')
+                              || this.waiting_for_first_update
+                              || this.has_error
+    }
+
+    // Property forwarding — .value, .selectionStart, .selectionEnd, .selectionDirection.
+    // Setting .value triggers client.changed() since textarea.value = ... doesn't fire
+    // the 'input' event that our input listener relies on.
+    get value()    { return this.textarea?.value ?? '' }
+    set value(v)   {
+        if (!this.textarea) return
+        this.textarea.value = v
+        this.client?.changed()
+    }
+
+    get selectionStart()      { return this.textarea?.selectionStart ?? 0 }
+    set selectionStart(v)     { if (this.textarea) this.textarea.selectionStart = v }
+
+    get selectionEnd()        { return this.textarea?.selectionEnd ?? 0 }
+    set selectionEnd(v)       { if (this.textarea) this.textarea.selectionEnd = v }
+
+    get selectionDirection()  { return this.textarea?.selectionDirection ?? 'none' }
+    set selectionDirection(v) { if (this.textarea) this.textarea.selectionDirection = v }
+
+    get textLength()          { return this.textarea?.textLength ?? 0 }
+
+    // Scroll forwarding — the inner textarea is the scroll container.
+    get scrollTop()           { return this.textarea?.scrollTop ?? 0 }
+    set scrollTop(v)          { if (this.textarea) this.textarea.scrollTop = v }
+
+    get scrollLeft()          { return this.textarea?.scrollLeft ?? 0 }
+    set scrollLeft(v)         { if (this.textarea) this.textarea.scrollLeft = v }
+
+    get scrollHeight()        { return this.textarea?.scrollHeight ?? 0 }
+    get scrollWidth()         { return this.textarea?.scrollWidth ?? 0 }
+
+    // Method forwarding — .focus(), .blur(), .select(), .setSelectionRange(), .setRangeText(),
+    // .scrollTo(), .scrollBy().
+    focus(options)            { this.textarea?.focus(options) }
+    blur()                    { this.textarea?.blur() }
+    select()                  { this.textarea?.select() }
+    setSelectionRange(...a)   { this.textarea?.setSelectionRange(...a) }
+    setRangeText(...a)        { this.textarea?.setRangeText(...a) }
+    scrollTo(...a)            { this.textarea?.scrollTo(...a) }
+    scrollBy(...a)            { this.textarea?.scrollBy(...a) }
+}
+
+
+customElements.define('synced-textarea', SyncedTextarea)

package/client/text-client.js

@@ -0,0 +1,269 @@
+// Text utility functions for simpleton text clients
+//
+// Used by simpleton.js and directly by editors.
+
+
+// ── UTF-16 / Unicode code-point helpers ────────────────────────────────
+// JS strings are UTF-16. Characters outside the Basic Multilingual Plane
+// (BMP) are encoded as two 16-bit code units (a surrogate pair: high
+// 0xD800-0xDBFF, low 0xDC00-0xDFFF). Such a pair represents one Unicode
+// code point.
+//
+// OTHER LANGUAGES: You don't need these if your string type is natively
+// indexed by code points.
+
+function get_char_size(str, utf16_index) {
+    const char_code = str.charCodeAt(utf16_index)
+    return (char_code >= 0xd800 && char_code <= 0xdbff) ? 2 : 1
+}
+
+function count_code_points(str) {
+    let code_points = 0
+    for (let i = 0; i < str.length; i++) {
+        if (str.charCodeAt(i) >= 0xd800 && str.charCodeAt(i) <= 0xdbff) i++
+        code_points++
+    }
+    return code_points
+}
+
+function is_low_surrogate(str, i) {
+    var c = str.charCodeAt(i)
+    return c >= 0xdc00 && c <= 0xdfff
+}
+
+function is_high_surrogate(str, i) {
+    var c = str.charCodeAt(i)
+    return c >= 0xd800 && c <= 0xdbff
+}
+
+// Converts patch ranges from code-point offsets to UTF-16 indices.
+// Patches must be sorted by range[0].
+function convert_ranges_codepoints_to_utf16(patches, str) {
+    let codepoint_index = 0
+    let utf16_index = 0
+    for (let patch of patches) {
+        while (codepoint_index < patch.range[0]) {
+            utf16_index += get_char_size(str, utf16_index)
+            codepoint_index++
+        }
+        patch.range[0] = utf16_index
+
+        while (codepoint_index < patch.range[1]) {
+            utf16_index += get_char_size(str, utf16_index)
+            codepoint_index++
+        }
+        patch.range[1] = utf16_index
+    }
+}
+
+// Converts patch ranges from UTF-16 indices to code-point offsets.
+// Patches must be sorted by range[0].
+function convert_ranges_utf16_to_codepoints(patches, str) {
+    let codepoint_index = 0
+    let utf16_index = 0
+    for (let patch of patches) {
+        while (utf16_index < patch.range[0]) {
+            utf16_index += get_char_size(str, utf16_index)
+            codepoint_index++
+        }
+        patch.range[0] = codepoint_index
+
+        while (utf16_index < patch.range[1]) {
+            utf16_index += get_char_size(str, utf16_index)
+            codepoint_index++
+        }
+        patch.range[1] = codepoint_index
+    }
+}
+
+// ── text_apply_patches ─────────────────────────────────────────────────
+// Applies patches to a string, tracking cumulative offset.
+//
+// Patches must have absolute coordinates (relative to the original
+// string, not to the string after previous patches). The offset
+// variable tracks the cumulative shift from previous patches.
+function text_apply_patches(state, patches) {
+    var offset = 0
+    for (var patch of patches) {
+        state = state.substring(0, patch.range[0] + offset) + patch.content +
+                state.substring(patch.range[1] + offset)
+        offset += patch.content.length - (patch.range[1] - patch.range[0])
+    }
+    return state
+}
+
+
+// ── Digest helpers ─────────────────────────────────────────────────────
+
+// Computes SHA-256 of the UTF-8 encoding of the string
+// Formatted as: sha-256=:<base64-encoded-hash>:
+async function get_digest(str) {
+    var bytes = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(str))
+    return `sha-256=:${btoa(String.fromCharCode(...new Uint8Array(bytes)))}:`
+}
+
+// Makes sure the current state matches the digest in the update
+async function check_digest(update, client_state) {
+    if (update.extra_headers?.["repr-digest"]?.startsWith('sha-256=')
+        && update.extra_headers["repr-digest"] !== await get_digest(client_state)) {
+        console.log('repr-digest mismatch!')
+        console.log('repr-digest: ' + update.extra_headers["repr-digest"])
+        console.log('state: ' + client_state)
+        throw new Error('repr-digest mismatch')
+    }
+}
+
+
+// ── Text update parsing / serialization ────────────────────────────────
+
+// Parse a wire update into text patches (with UTF-16 ranges)
+function text_parse_update(update, client_state) {
+    if (update.patches) {
+        for (let patch of update.patches) {
+            patch.range = patch.range.match(/\d+/g).map((x) => 1 * x)
+            patch.content = patch.content_text
+        }
+        var patches = update.patches.sort((a, b) => a.range[0] - b.range[0])
+        convert_ranges_codepoints_to_utf16(patches, client_state)
+        return patches
+    } else
+        return [{range: [0, 0], content: update.body_text}]
+}
+
+// Prepare text patches for the wire (converts to code-point ranges,
+// formats as simpleton text patches). Returns { patches, version_count }.
+function text_prepare_put(patches, client_state) {
+    convert_ranges_utf16_to_codepoints(patches, client_state)
+    var version_count = 0
+    for (let patch of patches) {
+        version_count += patch.range[1] - patch.range[0]
+        version_count += count_code_points(patch.content)
+        patch.unit = "text"
+        patch.range = `[${patch.range[0]}:${patch.range[1]}]`
+    }
+    return { patches, version_count }
+}
+
+
+// ── UI helpers ─────────────────────────────────────────────────────────
+
+function set_acked_state(textarea, on = true) {
+    if (on)
+        textarea.style.caretColor = textarea.old_caretColor
+    else {
+        textarea.old_caretColor = textarea.style.caretColor
+        textarea.style.caretColor = 'red'
+    }
+}
+
+function set_error_state(textarea, on = true) {
+    if (on) {
+        textarea.old_disabled = textarea.disabled
+        textarea.old_background = textarea.style.background
+        textarea.old_border = textarea.style.border
+
+        textarea.disabled = true
+        textarea.style.background = '#fee'
+        textarea.style.border = '4px solid red'
+    } else {
+        textarea.disabled = textarea.old_disabled
+        textarea.style.background = textarea.old_background
+        textarea.style.border = textarea.old_border
+    }
+}
+
+// A convenient wrapper around the myers-diff.js library's "diff_main()" function,
+// which is defined in https://braid.org/code/myers-diff1.js.
+function diff(before, after) {
+    let diff = diff_main(before, after)
+    let patches = []
+    let offset = 0
+    for (let d of diff) {
+        let p = null
+        if (d[0] === 1) p = { range: [offset, offset], content: d[1] }
+        else if (d[0] === -1) {
+            p = { range: [offset, offset + d[1].length], content: "" }
+            offset += d[1].length
+        } else offset += d[1].length
+        if (p) {
+            p.unit = "text"
+            patches.push(p)
+        }
+    }
+    return patches
+}
+
+// ── simple_diff ────────────────────────────────────────────────────────
+// Finds the longest common prefix and suffix between two strings,
+// returning the minimal edit that transforms `old_str` into `new_str`.
+//
+// Returns: { range: [prefix_len, old_str.length - suffix_len],
+//            content: new_str.slice(prefix_len, new_str.length - suffix_len) }
+//
+// This produces a single contiguous edit. For multi-cursor or
+// multi-region edits, supply a custom get_patches function instead.
+function simple_diff(old_str, new_str) {
+    var prefix_len = 0
+    var min_len = Math.min(old_str.length, new_str.length)
+    while (prefix_len < min_len && old_str[prefix_len] === new_str[prefix_len]) prefix_len++
+
+    // Don't split a surrogate pair: if prefix ends on a low surrogate,
+    // the preceding high surrogate only matched by coincidence (same
+    // Unicode block), so back up to include the whole pair in the diff.
+    if (prefix_len > 0 && is_low_surrogate(old_str, prefix_len))
+        prefix_len--
+
+    // Find common suffix length (from what remains after prefix)
+    var suffix_len = 0
+    min_len -= prefix_len
+    while (suffix_len < min_len
+           && (old_str[old_str.length - suffix_len - 1]
+               === new_str[new_str.length - suffix_len - 1]))
+        suffix_len++
+
+    // Same guard for suffixes: if the range end (old_str.length - suffix_len)
+    // lands on a low surrogate, the suffix consumed it without its high
+    // surrogate, so back up.
+    if (suffix_len > 0 && is_low_surrogate(old_str, old_str.length - suffix_len))
+        suffix_len--
+
+    return {range: [prefix_len, old_str.length - suffix_len],
+            content: new_str.slice(prefix_len, new_str.length - suffix_len)}
+}
+
+
+function apply_patches_and_update_selection(textarea, patches) {
+    let offset = 0
+    for (let p of patches) {
+        p.range[0] += offset
+        p.range[1] += offset
+        offset -= p.range[1] - p.range[0]
+        offset += p.content.length
+    }
+
+    let original = textarea.value
+    let sel = [textarea.selectionStart, textarea.selectionEnd]
+
+    for (var p of patches) {
+        let range = p.range
+
+        for (let i = 0; i < sel.length; i++)
+            if (sel[i] > range[0])
+                if (sel[i] > range[1])
+                    sel[i] -= range[1] - range[0]
+                else
+                    sel[i] = range[0]
+
+        for (let i = 0; i < sel.length; i++)
+            if (sel[i] > range[0])
+                sel[i] += p.content.length
+
+        original = original.substring(0, range[0])
+            + p.content
+            + original.substring(range[1])
+    }
+
+    textarea.value = original
+    textarea.selectionStart = sel[0]
+    textarea.selectionEnd = sel[1]
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "braid-text",
-  "version": "0.5.8",
+  "version": "0.5.9",
   "description": "Library for collaborative text over http using braid.",
   "author": "Braid Working Group",
   "repository": "braid-org/braid-text",
@@ -14,10 +14,12 @@
     "server.js",
     "server.d.ts",
     "simpleton-client.js",
-    "client/simpleton-sync.js",
+    "client/simpleton.js",
     "client/cursor-sync.js",
     "client/textarea-highlights.js",
-    "client/web-utils.js",
+    "client/text-client.js",
+    "client/syncarea.js",
+    "client/myers-diff.js",
     "README.md",
     "client/editor.html",
     "client/markdown-editor.html",