Restrict whitespace matches to actual style statements

Matching after every whitespace treats ordinary diagram text as a style statement whenever the later text resembles CSS. For example, sequenceDiagram\n Alice->>Bob: apply style from url(parameter) is valid message text, but the guard now returns only Alice->>Bob: apply ; pipe-delimited flowchart labels are similarly truncated and can become invalid because insideLabel does not recognize those label forms. Limit the whitespace-only case to state-diagram statement positions rather than applying it to every diagram line.

Useful? React with 👍 / 👎.

Fixed in b63e62c: whitespace-started statements only count in those diagram types; elsewhere a statement must start the line or follow a semicolon outside a quoted or bracketed label. The sequenceDiagram message and the pipe label example are now passed through unchanged (tests added).

Scan repeated style tokens in linear time

For a line with many non-fetching style tokens, every loop iteration rescans the entire preceding prefix in insideLabel and most of the remaining suffix with STYLE_FETCH, making this quadratic in attacker-controlled diagram length. A roughly 80 KB line containing 10,000 matches took about 12 seconds in a local Node run, and this guard executes synchronously during rendering, so such chat content can freeze the UI before Mermaid even parses it. Track label state while scanning once, or otherwise avoid rescanning the line for each match.

Useful? React with 👍 / 👎.

Fixed in b63e62c: one pass per line. The last fetch position is found once, and the label state is advanced only up to each match, so a long line of style words is linear (test with 20,000 tokens).

Do not treat state ID punctuation as an open label

State-diagram IDs may legally contain ( or [, so a valid source such as A( --> B classDef x fill:url(https://attacker.example/x) parses the suffix as a real classDef, but this counter treats the punctuation in A( as an unclosed label and skips the match. Applying that class to B therefore leaves the remote url(...) intact and restores the silent browser request this guard is intended to prevent. Label detection must follow Mermaid's actual token context rather than counting every delimiter in the prefix.

Useful? React with 👍 / 👎.

Fixed in b63e62c: in stateDiagram, erDiagram, block and requirementDiagram (whose lexers take mid-line statements and allow bracket punctuation in ids) every keyword counts with no label guessing, so A( --> B classDef x fill:url(...) is cut at the classDef (checked in Chromium, Firefox and WebKit: 1 request before, 0 after).

Preserve style-like text in mid-line diagram labels

Fresh evidence after the earlier fix: when midLine is true, this unconditional return still treats keywords inside valid labels as statements. For example, Mermaid 11.17.2 accepts erDiagram\n A {\n string description "apply style url(parameter)"\n }, but this function truncates the attribute to string description "apply , leaving an invalid diagram; quoted state and block labels have the same problem. Continue tracking quoted/bracketed label context for these diagram types instead of returning on every match.

Useful? React with 👍 / 👎.

Leaving this fail-closed on purpose. Tracking quotes in these diagram types reopens the fetch: with quote tracking, stateDiagram-v2 'A" --> B classDef x mask:url(...)' (a lone quote in a state id) still made 1 request in Chromium and Firefox and 1 in WebKit, because mermaid lexes the classDef after it; the current head cuts it (0 in all three). The cost is a quoted label in a stateDiagram / erDiagram / block / requirementDiagram line that holds both the word style and url( or a backslash, which shows a parse error and fetches nothing.

Carry label state across line boundaries

When a flowchart label spans lines and closes on the same line as a semicolon-separated style statement, invoking withoutFetchingStyle independently for every line resets quoted and depth before the closing delimiters. For example, flowchart LR\n A["hello\n world"]; style A fill:url(https://attacker.example/x) is accepted by Mermaid but passes through this guard unchanged: the closing quote is mistaken for an opening quote, so the semicolon branch skips the real style statement and the browser can request the remote URL. Scan the source with label state carried across lines, or otherwise account for labels opened on earlier lines.

Useful? React with 👍 / 👎.

Not changing this. With the mermaid build Studio ships, a flowchart style statement holding url(...) does not parse at all, so it cannot fetch: rendering flowchart LR\n A["hello\n world"]; style A fill:url(https://attacker.example/x) in Chromium gives Parse error on line 3 and no request, and the same happens for //host, quoted, escaped and image-set spellings, on one line or after a label that spans lines. A multi-line label with a plain colour style renders unchanged.

Detect diagram headers following init directives

When a mid-line-capable diagram header immediately follows an init directive on the same line, Mermaid removes the directive before detecting the diagram, but this anchored regex scans the raw source and leaves midLine false. For example, Mermaid accepts %%{init: {}}%%stateDiagram-v2\n A --> B classDef x fill:url(https://attacker.example/x)\n class B x, while the guard returns it unchanged, allowing the applied class to request the remote URL. Detect the diagram type after removing or blanking leading directives, or allow directives before the header.

Useful? React with 👍 / 👎.

Agreed. 3cb4a0f reads the diagram type after blanking init directives, so %%{init: {}}%%stateDiagram-v2 gets the mid-line rule. Checked with real mermaid in Chromium: that source made 1 remote request before and 0 after, and still renders; the case is in the tests.

Limit semicolon style detection to supporting diagrams

Fresh evidence after the earlier message-text fix: the semicolon branch still applies to every diagram type, including grammars where a semicolon remains ordinary title text and style statements are unsupported. Mermaid accepts gantt\n title First; style guide url(parameter)\n dateFormat YYYY-MM-DD unchanged, but this guard truncates the title to title First;; the same occurs for pie titles. Gate semicolon-started style detection on diagram types that actually parse these statements so harmless title text containing style and url(...) is preserved.

Useful? React with 👍 / 👎.

Not changing this. It only touches a gantt or pie title that has ; style followed by url( or a backslash on the same line; the title is cut at the ; and the chart still renders. That is a rare cosmetic loss next to keeping the semicolon rule the same in every diagram type.