登录 注册

一种输入标题导致运行时错误的情况

问题表现就是输入标题之后回车下一行也是标题，之后报运行时错误，直接贴操作过程了

  1. 首先在编辑器中正常输入（本次复现条件是输入列表）

  2. 输入列表，之后通过回车返回到段落块

  3. 输入 # 或Ctrl+Alt+1建立标题

    PixPin20250324092425.png

  4. 输入文本。注意到此时大纲列表中并不正常刷新当前标题文本

    PixPin20250324092446.png

  5. 按下删除键会直接删除当前整个标题，重建标题仍然报错

  6. 重建索引有概率解决问题，不过我在未报运行时错误时重建索引之后仍然出现问题

  7. 如果输入标题后出现当前问题：

    1. 已经输入回车出现第二个标题块，则只能删除整个标题块
    2. 未输入回车，光标仍在当前标题块

      1. 通过Ctrl+Alt+0可以转换回段落块

      2. 通过Ctrl+Alt+1可以转换回标题块

      3. 此时标题块文本右侧可能出现 <protyle-html> 标签，也可能没有

        PixPin20250324092523.png

      4. 不过此时大纲中显示当前标题名称，可以正常继续输入不会触发运行时错误

本次复现条件是主题，默认主题下没有测试，不过不容易观察也不容易复现，暂且认为是使用第三方主题都能复现。复现并不局限于单个文档，也不局限于某个主题 ，甚至不局限于输入法。

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

    融合块、大纲和双向链接，重构你的思维。

    25755 引用 • 106588 回帖
1 关注
15 回帖
8
6
254 72 42 1 138

相关帖子

15 回帖
一种输入标题导致运行时错误的情况

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册 关于
请输入回帖内容 ...
  • JeffreyChen • • 3 评论
    付费者 支持者 捐赠者

    可以试试把主题的 JS 都注释掉再重启思源测试

    还能复现，不过这次的条件细致到列表有第二项开始，只有一项的时候没有复现
    EmptyLight •
    @EmptyLight 那就再一块一块排查一下 CSS，看看什么 CSS 会出问题
    JeffreyChen •
    @JeffreyChen 以 VSCE 主题为测试对象，在主题添加了::before 或::after 之后会出现，表现在标题前面的那个图标。Savor 如果能复现就可能和标题后面那些点有关
    EmptyLight •
  • EmptyLight •
    付费者 作者

    目前复现情况：

    • VSCode Lite Edit 主题在启用标题图标开关后可复现
    • Savor 主题可复现，但此时出问题的标题后未显示当前标题级别的那些点

    预计问题是主题修改主题样式导致的，对于 VSCode Lite Edit 主题是 ::before，Savor 未知，不是 ::before 或 ::after，但是可以复现问题，并且在出现问题时不显示标题后的点

    2 回复
  • JeffreyChen •
    付费者 支持者 捐赠者

    如果有能稳定重现问题的 CSS 片段，麻烦发一下看看

    1 回复
  • EmptyLight •
    付费者 作者

    由 siyuan-vscodelite-edit/src/block/title-icon.scss at scss · emptylight370/siyuan-vscodelite-edit 编译得到，图标为单独 svg，这里由于长度限制只取一到三级标题

    @charset "UTF-8";
/* 用于修复显示图标之后标题会显示在下一行的问题 */
[data-node-id].h1 div:nth-child(1),
.protyle-preview h1 div:nth-child(1) {
  display: inline-block;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

[data-node-id].h2 div:nth-child(1),
.protyle-preview h2 div:nth-child(1) {
  display: inline-block;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

[data-node-id].h3 div:nth-child(1),
.protyle-preview h3 div:nth-child(1) {
  display: inline-block;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* h1标签基本样式 */
[data-node-id].h1[fold="1"][data-type=NodeHeading]::before,
.protyle-preview h1[fold="1"]::before, [data-node-id].h1::before,
.protyle-preview h1::before {
  content: "";
  display: inline-block;
  position: relative;
  width: 1.75rem;
  height: 1.75rem;
  mask: url(../../resources/h1.svg) no-repeat center center;
  mask-size: contain;
  background-color: var(--mk-block-header-h1);
  top: 0.2rem;
  margin-right: 0.2rem;
}

/* h1标签 */
[data-node-id].h1[fold="1"][data-type=NodeHeading]::before,
.protyle-preview h1[fold="1"]::before {
  height: 1.75rem !important;
  border-radius: unset;
  margin-top: unset;
  left: unset !important;
  top: 0.2rem !important;
}

/* h2标签基本样式 */
[data-node-id].h2[fold="1"][data-type=NodeHeading]::before,
.protyle-preview h2[fold="1"]::before, [data-node-id].h2::before,
.protyle-preview h2::before {
  content: "";
  display: inline-block;
  position: relative;
  width: 1.55rem;
  height: 1.55rem;
  mask: url(../../resources/h2.svg) no-repeat center center;
  mask-size: contain;
  background-color: var(--mk-block-header-h2);
  top: 0.2rem;
  margin-right: 0.2rem;
}

/* h2标签 */
[data-node-id].h2[fold="1"][data-type=NodeHeading]::before,
.protyle-preview h2[fold="1"]::before {
  height: 1.55rem !important;
  border-radius: unset;
  margin-top: unset;
  left: unset !important;
  top: 0.2rem !important;
}

/* h3标签基本样式 */
[data-node-id].h3[fold="1"][data-type=NodeHeading]::before,
.protyle-preview h3[fold="1"]::before, [data-node-id].h3::before,
.protyle-preview h3::before {
  content: "";
  display: inline-block;
  position: relative;
  width: 1.38rem;
  height: 1.38rem;
  mask: url(../../resources/h3.svg) no-repeat center center;
  mask-size: contain;
  background-color: var(--mk-block-header-h3);
  top: 0.2rem;
  margin-right: 0.2rem;
}

/* h3标签 */
[data-node-id].h3[fold="1"][data-type=NodeHeading]::before,
.protyle-preview h3[fold="1"]::before {
  height: 1.38rem !important;
  border-radius: unset;
  margin-top: unset;
  left: unset !important;
  top: 0.2rem !important;
}

/*# sourceMappingURL=title-icon.css.map */
​
  • JeffreyChen •
    付费者 支持者 捐赠者

    VSCode Lite Edit 主题在启用标题图标开关后可复现

    我重现不了，你安装 https://github.com/siyuan-note/siyuan/releases/tag/v3.1.26-dev3 试一下，还能重现的话录屏看看

    2 回复
  • EmptyLight •
    付费者 作者

    正常是明天发版了，我明天再测吧

  • EmptyLight • • 1 评论
    付费者 作者

    还是复现了，这次有录屏，感觉基本上把我遇到的问题差不多都复现了

    摆烂喽，网盘链接：网盘链接

    1 回复
    1 操作
    EmptyLight 在 2025-03-25 14:40:04 更新了该回帖
    小水管有点勉强，好像限速写错了，视频过两天换成网盘
    EmptyLight •
  • JeffreyChen •
    付费者 支持者 捐赠者

    我这里实在重现不了，你从新建工作空间开始录屏看看

    1 回复
  • EmptyLight •
    付费者 作者

    视频更大了，这次是网盘：网盘链接。从一开始就可以复现这个问题，有点怪怪的

    1 回复
  • JeffreyChen •
    付费者 支持者 捐赠者

    你创建标题块大纲不显示的那一步我就重现不了

    1 回复
  • EmptyLight •
    付费者 作者

    那我是没辙了，总不能是 Windows 有问题？

  • EmptyLight • • 1 评论
    付费者 作者

    自行进行了多种测试，实在是没办法弄明白这个东西，不管通过什么方式，只要通过 CSS 向标题中加入了图片，就会在输入时导致一些问题，然后思源无法识别标题结构，导致运行时错误。

    简单解释一下我的思考过程：

    正常的标题结构：

    <div data-subtype="h1" data-node-id data-node-index data-type="NodeHeading" class="h1" updated>
  <div contenteditable="true" spellcheck="false">标题文本</div>
  <div class="protyle-attr" contenteditable="false">&ZeroWidthWhiteSpace;</div>
</div>
​

    在输入时，所有文本都会进入 标题文本 部分，并且正常显示。在大部分情况下都是如此。

    如果主题通过 CSS 为标题添加了一些东西（如 VSCode Lite Edit），比如通过 ::before 添加了一个标题前的图标，或者通过 background-image 和对应样式添加了标题前（或后）的图标，在输入时，输入的文字仍然正常去到 标题文本 部分，但是会出现一些意外，比如：

    <div data-subtype="h1" data-node-id data-node-index data-type="NodeHeading" class="h1" updated>
  ::before <!--其实不限于这种情况，只是我前面发的代码是这样工作的-->
  <div contenteditable="true" spellcheck="false">出问题时的状态</div>
  <br>
  <div class="protyle-attr" contenteditable="false">&ZeroWidthWhiteSpace;</div>
</div>
​

    意外出现一个 <br> 标签，并且大纲面板中不能显示刚输入的标题文本。这时候及时使用CTRL+ALT+0（或CTRL+ALT+1）可以将这个一级标题转为段落块，之后又使用CTRL+ALT+1可以转换成一级标题。这时候就是正常的一级标题，不会出现运行时错误。不过转换之后会有一些遗留的问题，如下：

    <div data-subtype="h1" data-node-id data-node-index data-type="NodeHeading" class="h1" updated>
  ::before <!--依旧是主题添加的元素，内含图片-->
  <div contenteditable="true" spellcheck="false">
    <span data-type="text" style="white-space-collapse: break-spaces;">标题文本</span>
    "<protyle-html>&ZeroWidthWhiteSpace;"
  </div>
  <div class="protyle-attr" contenteditable="false">&ZeroWidthWhiteSpace;</div>
</div>
​

    这里会凭空冒出来一段文本 <protyle-html>&ZeroWidthWhiteSpace;，并且大纲面板中会显示为 标题文本<protyle-html>，手动删除后面的 <protyle-html> 可以恢复成刚才输入的标题文本。

    在进行上述测试之后，我将 ::before 方式添加的图片换成了 background-image 方式添加图片（显示效果仍与 VSCode Lite Edit 主题宣传图一致），仍然会导致运行时错误弹窗。在这个时候的 HTML 结构仅为上述 HTML 结构中去掉 ::before。

    1 回复
    测了这么久之后我的思源卡的要死，内存占用最高只到 1.2G，干点什么都要等两秒，可能是后台开多了，毕竟浏览器，VSCode 什么都开着，16G 内存吃到 85% 了
    EmptyLight •
  • JeffreyChen •
    付费者 支持者 捐赠者

    @Vanessa 看看

  • Vanessa • via macOS
    订阅者 付费者 支持者 捐赠者 MOD

    我这里也无法重现。

    正常的结构应该是这样的，看上去是 rang 不对，导致使用了浏览器默认的输入行为。

    image.png

    目前只能逐一排查问题。

    用伺服使用浏览器打开试试；关闭鼠标指针样式试试。

    不行的话在鼠标点击编辑器后和输入 # 及每一个字符后都在控制台输入 getSelection().getRangeAt(0) 并回车，查看一下日志。以上每一步并把 Dom 记录一下。

    谢谢。

    1 回复
  • EmptyLight • • 2 评论
    付费者 作者

    我自己的主题因为不知道什么修改暂时无法复现（希望以后也不要复现了），目前暂时切换到 Savor 录制问题。

    在浏览器伺服可以复现问题。复现的录屏附在下方。（含 getSelection()）

    因链滴限制还是放网盘了

    还是无法重现，range 也是正常的，换个输入发试试，或者输入数字再试试。
    Vanessa •
    @Vanessa 感谢 V 大指点，最新测试中发现问题限制到小狼毫输入法复现了，之前微软拼音也会的，今天测试不出来了，我准备检查一下触发情况，去那边反馈问问
    EmptyLight • • 1
请输入回帖内容 ...
EmptyLight
就地开摆，有事邮件
回帖
630
 帖子
31
 积分
10545

近期热议

推荐标签 标签

  • frp

    frp 是一个可用于内网穿透的高性能的反向代理应用，支持 TCP、UDP、 HTTP 和 HTTPS 协议。

    17 引用 • 7 回帖 • 2 关注
  • 禅道

    禅道是一款国产的开源项目管理软件，她的核心管理思想基于敏捷方法 scrum，内置了产品管理和项目管理，同时又根据国内研发现状补充了测试管理、计划管理、发布管理、文档管理、事务管理等功能，在一个软件中就可以将软件研发中的需求、任务、bug、用例、计划、发布等要素有序的跟踪管理起来，完整地覆盖了项目管理的核心流程。

    8 引用 • 15 回帖 • 6 关注
  • IPFS

    IPFS（InterPlanetary File System，星际文件系统）是永久的、去中心化保存和共享文件的方法，这是一种内容可寻址、版本化、点对点超媒体的分布式协议。请浏览 IPFS 入门笔记了解更多细节。

    20 引用 • 245 回帖 • 227 关注
  • 友情链接

    确认过眼神后的灵魂连接，站在链在！

    24 引用 • 373 回帖
  • 强迫症

    强迫症（OCD）属于焦虑障碍的一种类型，是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病，其特点为有意识的强迫和反强迫并存，一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。

    15 引用 • 161 回帖 • 2 关注
  • 大数据

    大数据（big data）是指无法在一定时间范围内用常规软件工具进行捕捉、管理和处理的数据集合，是需要新处理模式才能具有更强的决策力、洞察发现力和流程优化能力的海量、高增长率和多样化的信息资产。

    89 引用 • 113 回帖
  • HHKB

    HHKB 是富士通的 Happy Hacking 系列电容键盘。电容键盘即无接点静电电容式键盘（Capacitive Keyboard）。

    5 引用 • 74 回帖 • 515 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商，致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景，七牛先后推出了对象存储，融合 CDN 加速，数据通用处理，内容反垃圾服务，以及直播云服务等。

    29 引用 • 230 回帖 • 124 关注
  • CentOS

    CentOS（Community Enterprise Operating System）是 Linux 发行版之一，它是来自于 Red Hat Enterprise Linux 依照开放源代码规定释出的源代码所编译而成。由于出自同样的源代码，因此有些要求高度稳定的服务器以 CentOS 替代商业版的 Red Hat Enterprise Linux 使用。两者的不同在于 CentOS 并不包含封闭源代码软件。

    240 引用 • 224 回帖
  • Elasticsearch

    Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎，基于 RESTful 接口。Elasticsearch 是用 Java 开发的，并作为 Apache 许可条款下的开放源码发布，是当前流行的企业级搜索引擎。设计用于云计算中，能够达到实时搜索，稳定，可靠，快速，安装使用方便。

    117 引用 • 99 回帖 • 199 关注
  • 京东

    京东是中国最大的自营式电商企业，2015 年第一季度在中国自营式 B2C 电商市场的占有率为 56.3%。2014 年 5 月，京东在美国纳斯达克证券交易所正式挂牌上市（股票代码：JD），是中国第一个成功赴美上市的大型综合型电商平台，与腾讯、百度等中国互联网巨头共同跻身全球前十大互联网公司排行榜。

    14 引用 • 102 回帖 • 312 关注
  • 代码片段

    代码片段分为 CSS 与 JS 两种代码，添加在 [设置 - 外观 - 代码片段] 中，这些代码会在思源笔记加载时自动执行，用于改善笔记的样式或功能。

    用户在该标签下分享代码片段时需在帖子标题前添加 [css] 或 [js] 用于区分代码片段类型。

    174 引用 • 1213 回帖 • 4 关注
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞 I/O 模型而得以轻量和高效。

    139 引用 • 269 回帖
  • 深度学习

    深度学习（Deep Learning）是机器学习的分支，是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法。

    43 引用 • 44 回帖
  • JVM

    JVM（Java Virtual Machine）Java 虚拟机是一个微型操作系统，有自己的硬件构架体系，还有相应的指令系统。能够识别 Java 独特的 .class 文件（字节码），能够将这些文件中的信息读取出来，使得 Java 程序只需要生成 Java 虚拟机上的字节码后就能在不同操作系统平台上进行运行。

    180 引用 • 120 回帖 • 1 关注
  • flomo

    flomo 是新一代 「卡片笔记」 ，专注在碎片化时代，促进你的记录，帮你积累更多知识资产。

    6 引用 • 143 回帖
  • SSL

    SSL（Secure Sockets Layer 安全套接层），及其继任者传输层安全（Transport Layer Security，TLS）是为网络通信提供安全及数据完整性的一种安全协议。TLS 与 SSL 在传输层对网络连接进行加密。

    70 引用 • 193 回帖 • 413 关注
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流，分享无限上传的图片，发布链接和视频，更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 449 关注
  • Visio
    1 引用 • 2 回帖
  • 外包

    有空闲时间是接外包好呢还是学习好呢？

    26 引用 • 233 回帖 • 1 关注
  • Ngui

    Ngui 是一个 GUI 的排版显示引擎和跨平台的 GUI 应用程序开发框架，基于
    Node.js / OpenGL。目标是在此基础上开发 GUI 应用程序可拥有开发 WEB 应用般简单与速度同时兼顾 Native 应用程序的性能与体验。

    7 引用 • 9 回帖 • 400 关注
  • gRpc
    11 引用 • 9 回帖 • 94 关注
  • VirtualBox

    VirtualBox 是一款开源虚拟机软件，最早由德国 Innotek 公司开发，由 Sun Microsystems 公司出品的软件，使用 Qt 编写，在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 18 关注
  • abitmean

    有点意思就行了

    • 34 关注
  • Sphinx

    Sphinx 是一个基于 SQL 的全文检索引擎，可以结合 MySQL、PostgreSQL 做全文搜索，它可以提供比数据库本身更专业的搜索功能，使得应用程序更容易实现专业化的全文检索。

    1 引用 • 221 关注
  • ActiveMQ

    ActiveMQ 是 Apache 旗下的一款开源消息总线系统，它完整实现了 JMS 规范，是一个企业级的消息中间件。

    19 引用 • 13 回帖 • 675 关注
  • Thymeleaf

    Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。类似 Velocity、 FreeMarker 等，它也可以轻易的与 Spring 等 Web 框架进行集成作为 Web 应用的模板引擎。与其它模板引擎相比，Thymeleaf 最大的特点是能够直接在浏览器中打开并正确显示模板页面，而不需要启动整个 Web 应用。

    11 引用 • 19 回帖 • 394 关注

最新标签