DayuanJiang/next-ai-draw-io · error · Error
No diagram element found
Error message
No diagram element found
What it means
After HTML-entity-decoding the SVG's content attribute and parsing it as XML, no <diagram> element was found. The embedded content is expected to be a draw.io <mxfile> containing one or more <diagram> elements. This means the decoded payload is XML but not draw.io diagram XML — the content attribute held something else.
Source
Thrown at lib/utils.ts:1707
if (!encodedContent) {
throw new Error("SVG element does not have a 'content' attribute.")
}
// 3. Decode HTML entities (using a minimal function)
function decodeHtmlEntities(str: string) {
const textarea = document.createElement("textarea") // Use built-in element
textarea.innerHTML = str
return textarea.value
}
const xmlContent = decodeHtmlEntities(encodedContent)
// 4. Parse the XML content
const xmlDoc = parser.parseFromString(xmlContent, "text/xml")
const diagramElement = xmlDoc.querySelector("diagram")
if (!diagramElement) {
throw new Error("No diagram element found")
}
// 5. Extract base64 encoded data
const base64EncodedData = diagramElement.textContent
if (!base64EncodedData) {
throw new Error("No encoded data found in the diagram element")
}
// 6. Decode base64 data
const binaryString = atob(base64EncodedData)
// 7. Convert binary string to Uint8Array
const len = binaryString.length
const bytes = new Uint8Array(len)
for (let i = 0; i < len; i++) {
bytes[i] = binaryString.charCodeAt(i)
}
View on GitHub (pinned to 155ef4f7ac)
Solutions
- Decode the content attribute yourself and inspect what XML it actually contains
- Verify the decoded root element is <mxfile> (or directly <mxGraphModel> for single-diagram files) and wrap accordingly
- Re-export the diagram from draw.io to get a canonical embedded payload
- If entity decoding is the culprit, ensure the payload wasn't already decoded upstream
Example fix
// before
extractDiagramFromSvg(dataUri) // content attr holds non-drawio XML
// after: normalize the payload first
const inner = decodeHtmlEntities(svgEl.getAttribute('content'))
const wrapped = `<mxfile><diagram>${inner}</diagram></mxfile>` // only if inner is mxGraphModel Defensive patterns
Strategy: validation
Validate before calling
const xml = decodeEntities(svgEl.getAttribute('content')!)
const parsed = new DOMParser().parseFromString(xml, 'text/xml')
if (parsed.querySelector('parsererror') || !parsed.querySelector('diagram')) throw new Error('embedded content is not drawio mxfile xml') Type guard
function isDrawioEmbeddedXml(doc: Document): boolean {
return Boolean(doc.querySelector('mxfile > diagram'))
} Try / catch
try { extract(dataUri) } catch (e) { if ((e as Error).message === 'No diagram element found') throw new Error('svg content attribute holds non-drawio XML; inspect it manually') } Prevention
- Only feed draw.io-exported editable SVGs to the extractor
- Inspect the decoded content attribute when integrating new SVG sources
- Pre-validate the decoded root is <mxfile>
When it happens
Trigger: An SVG whose content attribute contains arbitrary embedded XML (metadata, foreign tool's format), entity decoding that failed or double-decoded and corrupted the markup, or a truncated content attribute.
Common situations: Third-party tools that reuse a 'content' attribute on <svg> for their own payload; hand-crafted SVGs mimicking draw.io's format; partially transferred files where the attribute got clipped.
Related errors
- addPageToDoc: opts.xml must be a bare <mxGraphModel>.
- No SVG element found in the input string.
- No encoded data found in the diagram element
- Error replacing nodes: ${error}
- SVG element does not have a 'content' attribute.
AI-assisted analysis of DayuanJiang/next-ai-draw-io@155ef4f7ac (2026-08-27).
Data as JSON: /api/errors/b2aa778d8306f41e.
Report an issue: GitHub.