登录 注册

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

本贴最后更新于 273 天前，其中的信息可能已经事过景迁

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

  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. 不过此时大纲中显示当前标题名称，可以正常继续输入不会触发运行时错误

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

  • 思源笔记

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

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

    28446 引用 • 119789 回帖
1 关注
15 回帖
8
6
385 76 5 71 3 229

相关帖子

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 •
    订阅者 付费者 支持者 捐赠者 MOD

    我这里也无法重现。

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

    image.png

    目前只能逐一排查问题。

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

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

    谢谢。

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

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

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

    因链滴限制还是放网盘了

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

近期热议

推荐标签 标签

  • Flume

    Flume 是一套分布式的、可靠的，可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 686 关注
  • Sillot

    Insights（注意当前设置 master 为默认分支）

    汐洛彖夲肜矩阵（Sillot T☳Converbenk Matrix），致力于服务智慧新彖乄，具有彖乄驱动、极致优雅、开发者友好的特点。其中汐洛绞架（Sillot-Gibbet）基于自思源笔记（siyuan-note），前身是思源笔记汐洛版（更早是思源笔记汐洛分支），是智慧新录乄终端（多端融合，移动端优先）。

    主仓库地址：Hi-Windom/Sillot

    文档地址：sillot.db.sc.cn

    注意事项：

    1. ⚠️ 汐洛仍在早期开发阶段，尚不稳定
    2. ⚠️ 汐洛并非面向普通用户设计，使用前请了解风险
    3. ⚠️ 汐洛绞架基于思源笔记，开发者尽最大努力与思源笔记保持兼容，但无法实现 100% 兼容
    29 引用 • 25 回帖 • 152 关注
  • golang

    Go 语言是 Google 推出的一种全新的编程语言，可以在不损失应用程序性能的情况下降低代码的复杂性。谷歌首席软件工程师罗布派克（Rob Pike）说：我们之所以开发 Go，是因为过去 10 多年间软件开发的难度令人沮丧。Go 是谷歌 2009 发布的第二款编程语言。

    502 引用 • 1397 回帖 • 241 关注
  • 宕机

    宕机，多指一些网站、游戏、网络应用等服务器一种区别于正常运行的状态，也叫“Down 机”、“当机”或“死机”。宕机状态不仅仅是指服务器“挂掉了”、“死机了”状态，也包括服务器假死、停用、关闭等一些原因而导致出现的不能够正常运行的状态。

    13 引用 • 82 回帖 • 74 关注
  • 禅道

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

    11 引用 • 15 回帖
  • 996

    “工作 996， 生病 ICU”

    13 引用 • 200 回帖 • 6 关注
  • CloudFoundry

    Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台，它支持多种框架、语言、运行时环境、云平台及应用服务，使开发人员能够在几秒钟内进行应用程序的部署和扩展，无需担心任何基础架构的问题。

    4 引用 • 16 回帖 • 200 关注
  • 机器学习

    机器学习（Machine Learning）是一门多领域交叉学科，涉及概率论、统计学、逼近论、凸分析、算法复杂度理论等多门学科。专门研究计算机怎样模拟或实现人类的学习行为，以获取新的知识或技能，重新组织已有的知识结构使之不断改善自身的性能。

    78 引用 • 37 回帖
  • 阿里云

    阿里云是阿里巴巴集团旗下公司，是全球领先的云计算及人工智能科技公司。提供云服务器、云数据库、云安全等云计算服务，以及大数据、人工智能服务、精准定制基于场景的行业解决方案。

    85 引用 • 324 回帖
  • Android

    Android 是一种以 Linux 为基础的开放源码操作系统，主要使用于便携设备。2005 年由 Google 收购注资，并拉拢多家制造商组成开放手机联盟开发改良，逐渐扩展到到平板电脑及其他领域上。

    337 引用 • 324 回帖 • 4 关注
  • Mobi.css

    Mobi.css is a lightweight, flexible CSS framework that focus on mobile.

    1 引用 • 6 回帖 • 799 关注
  • B3log

    B3log 是一个开源组织，名字来源于“Bulletin Board Blog”缩写，目标是将独立博客与论坛结合，形成一种新的网络社区体验，详细请看 B3log 构思。目前 B3log 已经开源了多款产品：Sym、Solo、Vditor 和 思源笔记。

    1062 引用 • 3456 回帖 • 124 关注
  • JVM

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

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

    React 是 Facebook 开源的一个用于构建 UI 的 JavaScript 库。

    192 引用 • 291 回帖 • 350 关注
  • Rust

    Rust 是一门赋予每个人构建可靠且高效软件能力的语言。Rust 由 Mozilla 开发，最早发布于 2014 年 9 月。

    60 引用 • 22 回帖 • 2 关注
  • OnlyOffice
    4 引用 • 41 关注
  • 运维

    互联网运维工作，以服务为中心，以稳定、安全、高效为三个基本点，确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。

    151 引用 • 257 回帖 • 1 关注
  • 大疆创新

    深圳市大疆创新科技有限公司(DJI-Innovations，简称 DJI)，成立于 2006 年，是全球领先的无人飞行器控制系统及无人机解决方案的研发和生产商，客户遍布全球 100 多个国家。通过持续的创新，大疆致力于为无人机工业、行业用户以及专业航拍应用提供性能最强、体验最佳的革命性智能飞控产品和解决方案。

    2 引用 • 14 回帖
  • 房星科技

    房星网，我们不和没有钱的程序员谈理想，我们要让程序员又有理想又有钱。我们有雄厚的房地产行业线下资源，遍布昆明全城的 100 家门店、四千地产经纪人是我们坚实的后盾。

    6 引用 • 141 回帖 • 623 关注
  • 以太坊

    以太坊（Ethereum）并不是一个机构，而是一款能够在区块链上实现智能合约、开源的底层系统。以太坊是一个平台和一种编程语言 Solidity，使开发人员能够建立和发布下一代去中心化应用。 以太坊可以用来编程、分散、担保和交易任何事物：投票、域名、金融交易所、众筹、公司管理、合同和知识产权等等。

    34 引用 • 367 回帖 • 1 关注
  • HBase

    HBase 是一个分布式的、面向列的开源数据库，该技术来源于 Fay Chang 所撰写的 Google 论文 “Bigtable：一个结构化数据的分布式存储系统”。就像 Bigtable 利用了 Google 文件系统所提供的分布式数据存储一样，HBase 在 Hadoop 之上提供了类似于 Bigtable 的能力。

    17 引用 • 6 回帖 • 72 关注
  • 外包

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

    26 引用 • 234 回帖 • 1 关注
  • 快应用

    快应用 是基于手机硬件平台的新型应用形态；标准是由主流手机厂商组成的快应用联盟联合制定；快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台；以平台化的生态模式对个人开发者和企业开发者全品类开放。

    15 引用 • 127 回帖
  • SVN

    SVN 是 Subversion 的简称，是一个开放源代码的版本控制系统，相较于 RCS、CVS，它采用了分支管理系统，它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 694 关注
  • Sym

    Sym 是一款用 Java 实现的现代化社区（论坛/BBS/社交网络/博客）系统平台。

    下一代的社区系统，为未来而构建

    524 引用 • 4602 回帖 • 731 关注
  • uTools

    uTools 是一个极简、插件化、跨平台的现代桌面软件。通过自由选配丰富的插件，打造你得心应手的工具集合。

    9 引用 • 75 回帖
  • OpenResty

    OpenResty 是一个基于 NGINX 与 Lua 的高性能 Web 平台，其内部集成了大量精良的 Lua 库、第三方模块以及大多数的依赖项。用于方便地搭建能够处理超高并发、扩展性极高的动态 Web 应用、Web 服务和动态网关。

    17 引用 • 51 关注

最新标签