🎨 Improve HTML code clipping siyuan-note/siyuan#11642

h2m.go

@@ -410,6 +410,13 @@ func (lute *Lute) genASTByDOM(n *html.Node, tree *parse.Tree) {
 					}
 				}
 
+				if 1 > len(node.LastChild.CodeBlockInfo) {
+					lang := util.DomAttrValue(n, "data-language")
+					if !strings.Contains(lang, " ") {
+						node.LastChild.CodeBlockInfo = []byte(lang)
+					}
+				}
+
 				if bytes.ContainsAny(node.LastChild.CodeBlockInfo, "-_ ") {
 					node.LastChild.CodeBlockInfo = nil
 				}

test/h2m_test.go

@@ -18,6 +18,7 @@ import (
 
 var html2MdTests = []parseTest{
 
+	{"142", "<div><div class=\"nx-rounded nx-pt-6\" id=\"headlessui-tabs-panel-:R38fd5cm:\" role=\"tabpanel\" aria-labelledby=\"headlessui-tabs-tab-:R2ofd5cm:\" tabindex=\"0\" data-headlessui-state=\"selected\"><div class=\"nextra-code-block nx-relative nx-mt-6 first:nx-mt-0\"><pre class=\"nx-bg-primary-700/5 nx-mb-4 nx-overflow-x-auto nx-rounded-xl nx-subpixel-antialiased dark:nx-bg-primary-300/10 nx-text-[.9em] contrast-more:nx-border contrast-more:nx-border-primary-900/20 contrast-more:nx-contrast-150 contrast-more:dark:nx-border-primary-100/40 nx-py-4\" data-language=\"python\" data-theme=\"default\"><code class=\"nx-border-black nx-border-opacity-[0.04] nx-bg-opacity-[0.03] nx-bg-black nx-break-words nx-rounded-md nx-border nx-py-0.5 nx-px-[.25em] nx-text-[.9em] dark:nx-border-white/10 dark:nx-bg-white/10 [counter-reset:line]\" dir=\"ltr\" data-line-numbers=\"\" data-language=\"python\" data-theme=\"default\" data-line-numbers-max-digits=\"2\"><span class=\"line\"><span style=\"color: var(--shiki-token-keyword);\">from</span><span style=\"color: var(--shiki-color-text);\"> openai </span><span style=\"color: var(--shiki-token-keyword);\">import</span><span style=\"color: var(--shiki-color-text);\"> OpenAI</span></span>\n<span class=\"line\"> </span>\n<span class=\"line\"><span style=\"color: var(--shiki-color-text);\">client </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-color-text);\"> </span><span style=\"color: var(--shiki-token-function);\">OpenAI</span><span style=\"color: var(--shiki-token-punctuation);\">(</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">    api_key </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-token-punctuation);\"> </span><span style=\"color: var(--shiki-token-string-expression);\">\"$MOONSHOT_API_KEY\"</span><span style=\"color: var(--shiki-token-punctuation);\">,</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">    base_url </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-token-punctuation);\"> </span><span style=\"color: var(--shiki-token-string-expression);\">\"https://api.moonshot.cn/v1\"</span><span style=\"color: var(--shiki-token-punctuation);\">,</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">)</span></span>\n<span class=\"line\"> </span>\n<span class=\"line\"><span style=\"color: var(--shiki-color-text);\">completion </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-color-text);\"> client</span><span style=\"color: var(--shiki-token-punctuation);\">.</span><span style=\"color: var(--shiki-color-text);\">chat</span><span style=\"color: var(--shiki-token-punctuation);\">.</span><span style=\"color: var(--shiki-color-text);\">completions</span><span style=\"color: var(--shiki-token-punctuation);\">.</span><span style=\"color: var(--shiki-token-function);\">create</span><span style=\"color: var(--shiki-token-punctuation);\">(</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">    model </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-token-punctuation);\"> </span><span style=\"color: var(--shiki-token-string-expression);\">\"moonshot-v1-8k\"</span><span style=\"color: var(--shiki-token-punctuation);\">,</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">    messages </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-token-punctuation);\"> [</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">        {</span><span style=\"color: var(--shiki-token-string-expression);\">\"role\"</span><span style=\"color: var(--shiki-token-punctuation);\">: </span><span style=\"color: var(--shiki-token-string-expression);\">\"system\"</span><span style=\"color: var(--shiki-token-punctuation);\">, </span><span style=\"color: var(--shiki-token-string-expression);\">\"content\"</span><span style=\"color: var(--shiki-token-punctuation);\">: </span><span style=\"color: var(--shiki-token-string-expression);\">\"你是 Kimi，由 Moonshot AI 提供的人工智能助手，你更擅长中文和英文的对话。你会为用户提供安全，有帮助，准确的回答。同时，你会拒绝一切涉及恐怖主义，种族歧视，黄色暴力等问题的回答。Moonshot AI 为专有名词，不可翻译成其他语言。\"</span><span style=\"color: var(--shiki-token-punctuation);\">},</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">        {</span><span style=\"color: var(--shiki-token-string-expression);\">\"role\"</span><span style=\"color: var(--shiki-token-punctuation);\">: </span><span style=\"color: var(--shiki-token-string-expression);\">\"user\"</span><span style=\"color: var(--shiki-token-punctuation);\">, </span><span style=\"color: var(--shiki-token-string-expression);\">\"content\"</span><span style=\"color: var(--shiki-token-punctuation);\">: </span><span style=\"color: var(--shiki-token-string-expression);\">\"你好，我叫李雷，1+1等于多少？\"</span><span style=\"color: var(--shiki-token-punctuation);\">}</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">    ],</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">    temperature </span><span style=\"color: var(--shiki-token-keyword);\">=</span><span style=\"color: var(--shiki-token-punctuation);\"> </span><span style=\"color: var(--shiki-token-constant);\">0.3</span><span style=\"color: var(--shiki-token-punctuation);\">,</span></span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-punctuation);\">)</span></span>\n<span class=\"line\"> </span>\n<span class=\"line\"><span style=\"color: var(--shiki-token-function);\">print</span><span style=\"color: var(--shiki-token-punctuation);\">(completion.choices[</span><span style=\"color: var(--shiki-token-constant);\">0</span><span style=\"color: var(--shiki-token-punctuation);\">].message.content)</span></span></code></pre><div class=\"nx-opacity-0 nx-transition [div:hover>&amp;]:nx-opacity-100 focus-within:nx-opacity-100 nx-flex nx-gap-1 nx-absolute nx-m-[11px] nx-right-0 nx-top-0\"><button class=\"nextra-button nx-transition-all active:nx-opacity-50 nx-bg-primary-700/5 nx-border nx-border-black/5 nx-text-gray-600 hover:nx-text-gray-900 nx-rounded-md nx-p-1.5 dark:nx-bg-primary-300/10 dark:nx-border-white/10 dark:nx-text-gray-400 dark:hover:nx-text-gray-50 md:nx-hidden\" title=\"Toggle word wrap\"><svg viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" class=\"nx-pointer-events-none nx-h-4 nx-w-4\"><path fill=\"currentColor\" d=\"M4 19h6v-2H4v2zM20 5H4v2h16V5zm-3 6H4v2h13.25c1.1 0 2 .9 2 2s-.9 2-2 2H15v-2l-3 3l3 3v-2h2c2.21 0 4-1.79 4-4s-1.79-4-4-4z\"></path></svg></button><button class=\"nextra-button nx-transition-all active:nx-opacity-50 nx-bg-primary-700/5 nx-border nx-border-black/5 nx-text-gray-600 hover:nx-text-gray-900 nx-rounded-md nx-p-1.5 dark:nx-bg-primary-300/10 dark:nx-border-white/10 dark:nx-text-gray-400 dark:hover:nx-text-gray-50\" title=\"Copy code\" tabindex=\"0\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"currentColor\" class=\"nextra-copy-icon nx-pointer-events-none nx-h-4 nx-w-4\"><rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></rect><path d=\"M5 15H4C2.89543 15 2 14.1046 2 13V4C2 2.89543 2.89543 2 4 2H13C14.1046 2 15 2.89543 15 4V5\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path></svg></button></div></div></div><span aria-hidden=\"true\" id=\"headlessui-tabs-panel-:R58fd5cm:\" role=\"tabpanel\" aria-labelledby=\"headlessui-tabs-tab-:R4ofd5cm:\" tabindex=\"-1\" style=\"position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px;\"></span><span aria-hidden=\"true\" id=\"headlessui-tabs-panel-:R78fd5cm:\" role=\"tabpanel\" tabindex=\"-1\" style=\"position:fixed;top:1px;left:1px;width:1px;height:0;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0\" aria-labelledby=\"headlessui-tabs-tab-:R6ofd5cm:\"></span></div>", "```python\nfrom openai import OpenAI\n \nclient = OpenAI(\n    api_key = \"$MOONSHOT_API_KEY\",\n    base_url = \"https://api.moonshot.cn/v1\",\n)\n \ncompletion = client.chat.completions.create(\n    model = \"moonshot-v1-8k\",\n    messages = [\n        {\"role\": \"system\", \"content\": \"你是 Kimi，由 Moonshot AI 提供的人工智能助手，你更擅长中文和英文的对话。你会为用户提供安全，有帮助，准确的回答。同时，你会拒绝一切涉及恐怖主义，种族歧视，黄色暴力等问题的回答。Moonshot AI 为专有名词，不可翻译成其他语言。\"},\n        {\"role\": \"user\", \"content\": \"你好，我叫李雷，1+1等于多少？\"}\n    ],\n    temperature = 0.3,\n)\n \nprint(completion.choices[0].message.content)\n```\n"},
 	{"141", "<code>&amp;ZeroWidthSpace;</code>", "`&ZeroWidthSpace;`\n"},
 	{"140", "<span class=\"texhtml\">{<i>f</i><sub><i>k</i></sub>}<sub><i>k</i> ∈ <b>N</b></sub></span>", "$\\{f_k\\}_k ∈ N$\n"},
 	{"139", "<div id=\"readability-page-1\" class=\"page\">\n    <div class=\"tablet:max-xl:w-mid-content xl:w-content flex\" id=\"post-content\">\n        <div class=\" post-body text-gray-text xl:col-start-1 xl:order-4 order-4 text-lg\">\n            <p><img src=\"https://test.com/foo.png\"\n                    width=\"640\" height=\"366\" alt=\"bar\"></p>\n            <p>baz\n            </p>\n        </div>\n    </div>\n</div>", "![bar](https://test.com/foo.png)\n\nbaz\n"},