From b15a4c3eae1ff190cc734c5c160cc9944bbc3fd3 Mon Sep 17 00:00:00 2001 From: shoma-mano Date: Mon, 8 Jan 2024 01:02:19 +0900 Subject: [PATCH 1/5] other: #51 add tip for isEnd function loop --- .../070-more-complex-parser.md | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/book/online-book/src/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/10-minimum-example/070-more-complex-parser.md index 2bb95e01..02062b5b 100644 --- a/book/online-book/src/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/10-minimum-example/070-more-complex-parser.md @@ -281,6 +281,27 @@ function startsWithEndTagOpen(source: string, tag: string): boolean { 続いて parseElement と parseText について実装していきます。 +::: tip isEnd のループについて + isEnd では ancestors の配列のそれぞれの要素に対して startsWithEndTagOpen で s がその要素の閉じタグで始まっている文字列かどうかをループでチェックするような処理になっています。 +```typescript +function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { + const s = context.source; + + // sが"= 0; --i) { + if (startsWithEndTagOpen(s, ancestors[i].tag)) { + return true; + } + } + } + + return !s; +} +``` +しかし、s が閉じタグで始まっている文字列かどうかをチェックするのであれば、ancestors の最後の要素に対してのみチェックすれば良いはずです。parser のリライトによってこのコードは無くなってしまいましたが、リライト前の Vue 3.3 のコードで ancestors の最後の要素に対してのみチェックするようにコードを書き換えしても正常系のテストは全て PASS します。 +::: + ## parseText まずはシンプルな parseText の方から.一部、parseText 以外でも使うユーティリティも実装しているので少しだけ長いです。 From 5da3b1138f5b567ca75ab62c840a5a370cc467e5 Mon Sep 17 00:00:00 2001 From: shoma-mano Date: Mon, 8 Jan 2024 11:29:00 +0900 Subject: [PATCH 2/5] supplement(parser): reason for looping and searching for tags in the function isEnd is --- .../070-more-complex-parser.md | 2 +- .../070-more-complex-parser.md | 21 +++++++++++++++++++ 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/book/online-book/src/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/10-minimum-example/070-more-complex-parser.md index 02062b5b..3d1f92f6 100644 --- a/book/online-book/src/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/10-minimum-example/070-more-complex-parser.md @@ -299,7 +299,7 @@ function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { return !s; } ``` -しかし、s が閉じタグで始まっている文字列かどうかをチェックするのであれば、ancestors の最後の要素に対してのみチェックすれば良いはずです。parser のリライトによってこのコードは無くなってしまいましたが、リライト前の Vue 3.3 のコードで ancestors の最後の要素に対してのみチェックするようにコードを書き換えしても正常系のテストは全て PASS します。 +しかし、s が閉じタグで始まっている文字列かどうかをチェックするのであれば、ancestors の最後の要素に対してのみチェックすれば良いはずです。parser のリライトによってこのコードは無くなってしまいましたが、リライト前の Vue 3.3 のコードで ancestors の最後の要素に対してのみチェックするようにコードを書き換えても正常系のテストは全て PASS します。 ::: ## parseText diff --git a/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md index a4474d10..597c80a1 100644 --- a/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md @@ -282,6 +282,27 @@ function startsWithEndTagOpen(source: string, tag: string): boolean { Next, let's implement parseElement and parseText. +::: tip About the isEnd Loop +In isEnd, there is a loop process that checks whether 's' starts with the closing tag of each element in the ancestors array using startsWithEndTagOpen. +```typescript +function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { + const s = context.source; + + // If s starts with "= 0; --i) { + if (startsWithEndTagOpen(s, ancestors[i].tag)) { + return true; + } + } + } + + return !s; +} +``` +However, if you need to check whether 's' starts with a closing tag, it should be sufficient to check only the last element in ancestors. Although this section of code was eliminated in a recent rewrite of the parser, modifying the Vue 3.3 code to only check the last element in ancestors still results in all the positive tests passing successfully. +::: + ## parseText First, let's start with the simple parseText. It is a bit long because it also implements some utilities that are used not only in parseText but also in other functions. From bdd5963a903bb08e006b083bff11028b3cafff37 Mon Sep 17 00:00:00 2001 From: shoma-mano Date: Mon, 8 Jan 2024 11:38:05 +0900 Subject: [PATCH 3/5] remove semi-colons and double quotes --- .../src/10-minimum-example/070-more-complex-parser.md | 8 ++++---- .../src/en/10-minimum-example/070-more-complex-parser.md | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/book/online-book/src/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/10-minimum-example/070-more-complex-parser.md index 3d1f92f6..24bd6ff8 100644 --- a/book/online-book/src/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/10-minimum-example/070-more-complex-parser.md @@ -285,18 +285,18 @@ function startsWithEndTagOpen(source: string, tag: string): boolean { isEnd では ancestors の配列のそれぞれの要素に対して startsWithEndTagOpen で s がその要素の閉じタグで始まっている文字列かどうかをループでチェックするような処理になっています。 ```typescript function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { - const s = context.source; + const s = context.source - // sが"= 0; --i) { if (startsWithEndTagOpen(s, ancestors[i].tag)) { - return true; + return true } } } - return !s; + return !s } ``` しかし、s が閉じタグで始まっている文字列かどうかをチェックするのであれば、ancestors の最後の要素に対してのみチェックすれば良いはずです。parser のリライトによってこのコードは無くなってしまいましたが、リライト前の Vue 3.3 のコードで ancestors の最後の要素に対してのみチェックするようにコードを書き換えても正常系のテストは全て PASS します。 diff --git a/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md index 597c80a1..68a0e2df 100644 --- a/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md @@ -286,18 +286,18 @@ Next, let's implement parseElement and parseText. In isEnd, there is a loop process that checks whether 's' starts with the closing tag of each element in the ancestors array using startsWithEndTagOpen. ```typescript function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { - const s = context.source; + const s = context.source - // If s starts with "= 0; --i) { if (startsWithEndTagOpen(s, ancestors[i].tag)) { - return true; + return true } } } - return !s; + return !s } ``` However, if you need to check whether 's' starts with a closing tag, it should be sufficient to check only the last element in ancestors. Although this section of code was eliminated in a recent rewrite of the parser, modifying the Vue 3.3 code to only check the last element in ancestors still results in all the positive tests passing successfully. From c945e3ba19ac8c7833383b8b4e64a7c9b72dec0d Mon Sep 17 00:00:00 2001 From: ubugeeei <71201308+Ubugeeei@users.noreply.github.com> Date: Mon, 8 Jan 2024 13:06:56 +0900 Subject: [PATCH 4/5] tweak: quote --- .../src/10-minimum-example/070-more-complex-parser.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/book/online-book/src/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/10-minimum-example/070-more-complex-parser.md index 24bd6ff8..b4ada60e 100644 --- a/book/online-book/src/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/10-minimum-example/070-more-complex-parser.md @@ -287,8 +287,8 @@ function startsWithEndTagOpen(source: string, tag: string): boolean { function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { const s = context.source - // sが= 0; --i) { if (startsWithEndTagOpen(s, ancestors[i].tag)) { return true From ad220178f6df16382e7962675af5dc8a0ac7d5ea Mon Sep 17 00:00:00 2001 From: ubugeeei <71201308+Ubugeeei@users.noreply.github.com> Date: Mon, 8 Jan 2024 13:08:47 +0900 Subject: [PATCH 5/5] tweak: quotes --- .../src/en/10-minimum-example/070-more-complex-parser.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md b/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md index 68a0e2df..16fb9a5b 100644 --- a/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md +++ b/book/online-book/src/en/10-minimum-example/070-more-complex-parser.md @@ -289,7 +289,7 @@ function isEnd(context: ParserContext, ancestors: ElementNode[]): boolean { const s = context.source // If s starts with = 0; --i) { if (startsWithEndTagOpen(s, ancestors[i].tag)) { return true