Pugの構文が書かれたノートを見るとクラッシュする

anon7583238 · November 19, 2020, 10:52pm

バグ報告

このような表示になり何もできなくなってしまいました。
pugのモジュールがエラー内にあるようですので、ノート内に書いたpugの構文とかぶっているのでしょうか…？
ご確認いただければ、幸いです

エラーメッセージ

TypeError: Cannot read property 'name' of null
    at Function.a.default.getMode (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-commons.js:1:46080)
    at setInnerMode (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/codemirror/mode/pug/pug.js:482:23)
    at dot (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/codemirror/mode/pug/pug.js:467:7)
    at Object.nextToken [as token] (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/codemirror/mode/pug/pug.js:576:10)
    at Object.local (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/mode/markdown/markdown.js:316:36)
    at Object.token (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/mode/markdown/markdown.js:855:26)
    at Object.n.defineMode.E.token (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-commons.js:1:76581)
    at readToken (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/lib/codemirror.js:1168:30)
    at takeToken (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/lib/codemirror.js:1190:21)
    at CodeMirror.getLineTokens (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/lib/codemirror.js:8302:22)
    at t.default (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-main.js:4:360772)
    at O (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-main.js:4:344424)
    at E.componentDidMount (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-main.js:4:351351)
    at Ji (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:212:138)
    at Sj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:255:235)
    at exports.unstable_runWithPriority (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/scheduler/cjs/scheduler.production.min.js:19:473)
    at cg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:122:331)
    at Jj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:248:376)
    at yj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:239:388)
    at /Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:123:121
    at exports.unstable_runWithPriority (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/scheduler/cjs/scheduler.production.min.js:19:473)
    at cg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:122:331)
    at fg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:123:67)
    at gg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:122:502)
    at Mj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:240:72)
    at Object.notify (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-redux/lib/utils/Subscription.js:25:13)
    at Subscription.notifyNestedSubs (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-redux/lib/utils/Subscription.js:98:26)
    at Subscription.handleChangeWrapper (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-redux/lib/utils/Subscription.js:103:18)
    at dispatch (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/redux/lib/redux.js:228:13)
    at /Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/redux-thunk/lib/index.js:14:22

利用環境

macOS
Mojave/10.14.6
App Version: (5.1.2 )

再現方法

pugの構文が記述されたノートを読む。

craftzdog · November 20, 2020, 4:20am

Katoさん

ご報告ありがとうございます。
どうやら特定のpug構文にてエラーが発生するようです。
pugについてあまり詳しくないのですが、setInnerModeが呼ばれている事から察するに別の言語を埋め込む事が出来るのでしょうか。
手元ではうまく再現出来ませんでした。
エラーメッセージによればgetModeに指定されたname引数がnullのためエラーになっているようです。
ひとまず、アプリ側では name 引数を厳密にチェックするように変更したいと思います。
再現するpugがもしわかりましたら教えて下さい。

anon7583238 · November 20, 2020, 5:11am

確認ありがとうございます
現状はInkdropを再起動してもすぐにエラー画面に飛んでしまうため
原因となる構文の確認ができていない状態です。

craftzdog · November 20, 2020, 8:50am

それは困りますね。
取り急ぎこちらにパッチを当ててみました。ご確認ください：

https://inkdrop-dist.s3-ap-northeast-1.amazonaws.com/tmp/Inkdrop-5.2.0-beta.1-Mac-patch-1.zip

anon7583238 · November 20, 2020, 11:47am

エラーの内容が以下のように変わりました。
未だノートにはたどり着けずです。

TypeError: Cannot read property 'name' of null
    at Function.a.default.getMode (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-commons.js:1:47191)
    at Function.a.default.getMode (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-commons.js:1:47043)
    at setInnerMode (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/codemirror/mode/pug/pug.js:482:23)
    at dot (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/codemirror/mode/pug/pug.js:467:7)
    at Object.nextToken [as token] (/Applications/Inkdrop.app/Contents/Resources/app.asar/node_modules/codemirror/mode/pug/pug.js:576:10)
    at Object.local (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/mode/markdown/markdown.js:316:36)
    at Object.token (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/mode/markdown/markdown.js:855:26)
    at Object.n.defineMode.E.token (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-commons.js:1:77612)
    at readToken (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/lib/codemirror.js:1168:30)
    at takeToken (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/lib/codemirror.js:1190:21)
    at CodeMirror.getLineTokens (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/codemirror/lib/codemirror.js:8307:22)
    at t.default (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-main.js:4:362190)
    at O (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-main.js:4:345842)
    at E.componentDidMount (file:///Applications/Inkdrop.app/Contents/Resources/app.asar/browser-main.js:4:352769)
    at Ji (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:212:138)
    at Sj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:255:235)
    at exports.unstable_runWithPriority (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/scheduler/cjs/scheduler.production.min.js:19:473)
    at cg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:122:331)
    at Jj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:248:376)
    at yj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:239:388)
    at /Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:123:121
    at exports.unstable_runWithPriority (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/scheduler/cjs/scheduler.production.min.js:19:473)
    at cg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:122:331)
    at fg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:123:67)
    at gg (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:122:502)
    at Mj (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-dom/cjs/react-dom.production.min.js:240:72)
    at Object.notify (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-redux/lib/utils/Subscription.js:25:13)
    at Subscription.notifyNestedSubs (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-redux/lib/utils/Subscription.js:96:26)
    at Subscription.handleChangeWrapper (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/react-redux/lib/utils/Subscription.js:101:18)
    at dispatch (/Applications/Inkdrop.app/Contents/Resources/app.asar/app/static/node_modules/redux/lib/redux.js:228:13)

craftzdog · November 20, 2020, 2:19pm

なるほど。
こちらはどうでしょうか？

https://inkdrop-dist.s3-ap-northeast-1.amazonaws.com/tmp/Inkdrop-5.2.0-beta.1-Mac-patch-2.zip

anon7583238 · November 22, 2020, 1:01pm

無事ノートが開けました！
ありがとうございますー！

craftzdog · November 23, 2020, 5:08am

よかったです！ちなみにどんなpugコードだったか教えていただけますか？

anon7583238 · November 23, 2020, 6:33am

こんな感じです。

# 参考
Jade について。
https://gist.github.com/japboy/5402844
Jadeでゴリゴリ書いてく時にちょっと注意することとか - あまり新しくないもの
http://rtshaaaa.hateblo.jp/entry/2013/11/15/092507
Pugのfor文、each in文 - Pug入門 | ねこしすてむ
http://necosystem.hirokihomma.com/archives/165/
pug/jade HTMLテンプレートエンジンに関するメモ
https://gist.github.com/retorillo/356251a381414643474a


# for
**pug**
```pug
-var name = ['神浜 コウジ','速水 ヒロ','仁科 カヅキ','一条 シン','香賀美 タイガ','十王院 カケル','大和 アレクサンダー']

ul
  for val, index in name
    li #{name[index]}
```

**結果**
```html
<ul>
	<li>神浜 コウジ</li>
	<li>速水 ヒロ</li>
	<li>仁科 カヅキ</li>
	<li>一条 シン</li>
	<li>香賀美 タイガ</li>
	<li>十王院 カケル</li>
	<li>大和 アレクサンダー</li>
</ul>
```

## forの中でindex指定
[Jade] each で要素だけでなく index も取得する | CodeNote
http://codenote.net/nodejs/jade/2192.html

```pug
if index === 4
  br.sp-only
    else
  | &nbsp;
```

## While
```pug
- var n = 1;
while n < 4
  p #{n}
  - n++
```

```html
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
```

## ClassやIDを変数で指定

**pug**
```pug
-var test = {a:'myclass',b:'myid'}
p(class=a)hoge
p(id=b)foo

ul
  for val, index in test
    li(class=test.a)
    li(id=test.b)
```

**結果**
```html
<ul>
	<li class="myclass"></li>
  <li id="myid"></li>
</ul>
```

## 連想配列を使う

```pug
-
   var step = [
   {
   "id": "01"
  },
  {
   "id": "02"
  },
  {
   "id": "03"
  },
  {
   "id": "04"
  },
  {
   "id": "05"
  }
   ]

each item, index in step
// each item in step
			p #{item.id}
```

### 出力結果
```html
<p>01</p>
<p>02</p>
<p>03</p>
<p>04</p>
<p>05</p>
```

# コンパイルせずにそのまま書き出し
```pug
div#facebook.
  <div id="fb-root"></div>
  <script>
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
  </script>
  <div class="fb-like" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>
```
ラップ要素に`.`をつけてインデントした箇所はそのまま書き出される。

# if
## 三項演算子
```pug
a(href = https ? "https://example.com" : "http://example.com")
```

craftzdog · November 23, 2020, 6:37am

ありがとうございますー！