vscode を使って MarkLogic xqy/sjs をデバッグする方法

## 0.概要
　MarkLogic用クエリ(xquery/java-script)をデバッグする時、xdmp:log()をよく利用しますが、ブレークポイントを設定したり、ステップ実行する方法３つあります。

- [Oxygen XML Editor](https://developer.marklogic.com/code/oxygen/)を利用する
- [XQDebug](https://developer.marklogic.com/code/xqdebug/)を利用する
- [Visual Studio Code](https://developer.marklogic.com/code/vscode/)を利用する

本文はVS Codeを利用する方法をご紹介します。

## 1.共通手順
#### 拡張モジュールをインストール
1. VSCode左の拡張モジュールボタン（下図の①）を押下
1. 検索ボックスにmarklogicを入れ
1. 現時点検索結果１件のみである、その右下のInstallボタン（下図の③）を押下

![rapture_20210502163345.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/9e73d328-b337-1459-6465-821032bfc367.png)

#### MarkLogic接続情報を設定
拡張モジュールの説明（上記画像の右側）を読めば設定方法が分かります。

左下の歯車アイコンからsettingsを選ぶ（ctrl+,）設定を開く

1. Extensions -> MarkLogic conne... を選ぶ
1. MarkLogic: Documents Dbに利用するデータベースを記載（例はDocuments）
1. MarkLogic: Modules Dbに利用するモジュールDBを記載（例はModules）

※記載しない時デフォルト利用すると書いてありますが、自分の環境はできませんでした。
![rapture_20210502174950.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/58a11387-dc0f-8558-9c27-ac5cf6069a92.png)

#### クエリ実行
VS Codeで現在開いているxqy/javascriptを実行させる時の手順

- 任意のxqueryファイルを開いて
- コマンドプレート（ctrl + shift + p）を開く
- 検索欄に marklogic を入れ
- 結果から「Marklogic: Eval XQuery」或いは「MarkLogic: Eval JS」を選ぶ

![rapture_20210502181415.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/4a3294a7-4906-87c5-f7e2-205523c6b662.png)

#### 実行結果確認
下図上段はxquery、中段はjavascript、下段は別窓で表示されるMarkLogicログ。
上段と中段の左は実行されるクエリ、右は自動で表示される実行結果窓。
![rapture_20210502182317.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/858cbb6a-9477-3ee2-0806-05f53e373583.png)

※拡張子sjsのファイルに文字色付けられない場合、ctrl + shift + p 後、 Change Language Mode で強制に Java Scriptに変更することができます。

## 2.XQueryに関する手順
### 2.1.デバッグ
#### デバッグ設定
1. VS Code左側のデバッグボタン（ ① ）を押下
1. 設定を保存んするため、フォルダーを開く必要がありと提示される（②）
![rapture_20210502190117.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/2148cdb2-9f1c-8dac-b71b-71d1dcf72bbd.png)

フォルダーを開いて、再度以下の操作
1. デバッグボタンを押下
1. create a launch.json fileをクリック
1. 一覧に「MarkLogic XQY Debugger」を選ぶ
![rapture_20210502190732.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/d10c7f7f-c0c2-200a-f73f-da7378b58083.png)

下記のように、自動的に launch.json が作られ、そしたら
- 10行目の文を "launch xqy" に変更
- 17行目の文を "attach xqy" に変更
- launch.json を保存する（ctrl + sを押下）
　※ここで修正した name が実行設定の名前は、図上③の場所に表示される
![rapture_20210502191057.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/7c3eeab8-2ff8-d58d-ad2a-8a8c2b96dbc7.png)

#### デバッグ実施
1. クエリタブを選んで、
1. 「launch xqy」が選択されたことを確認
1. 隣りの緑矢印を押下、デバッグを開始させる。
　デバッグ操作は割愛します。
![rapture_20210502191756.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/1fff8861-f97d-3a9c-4685-866cabb2cdea.png)

### 2.2.アタッチ
#### アタッチとは
　アタッチ(attach)とは、MarkLogicサーバー内実行しているクエリをデバッグする方法。
※デバッグはクライアント側（VS Codeが実行するマシン）のファイルを（一時MarkLogicに送信して）実行する方法。

#### アタッチの流れ
- サーバーに接続
- （VS Code以外で）クエリを実行
- アタッチする
- デバッグ開始

#### httpサーバ作成
アタッチする時、該当サーバー側のクエリ実行が全て止まるので、MarkLogic既存のサーバーではなく、新たにhttpサーバーを作成しましょう。設定値は下図ご参考。
![rapture_20210502213959.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/76577220-193a-9a95-d626-3f2db16ddead.png)

#### サーバー接続
VS Codeにて
1. コマンドプレート（ctrl + shift + p）を開く
1. 検索欄に marklogic を入れ
1. 結果から「Marklogic: Connect XQuery Debug Server」を選ぶ
![rapture_20210502214520.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/09b0e434-cc7f-5cdd-0762-153a039dfa2f.png)

すると、接続可能なサーバー一覧が表示され、適切に選ぶ（例は`debugHttpServer`を選ぶ）
![rapture_20210502214824.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/ce695416-7348-397f-980a-4ad67e8ad2bc.png)

画面下部に接続成功メッセージが表示されます。
![rapture_20210502214932.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/558fa00a-b771-4f59-e45d-7d6e6c6b1b95.png)

ちなみに、新規httpサーバー作成しないと、以下のエラーになります。
![rapture_20210502200333.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/65e688f2-b5fd-7e08-422a-3c56ca4347dd.png)

#### クエリをMarkLogicサーバーに配置
1. MarkLogicクエリコンソールに接続
1. データベースを「Modules」を選ぶ
1. 「Explore」ボタンを押下
1. 「New」ボタンを押下
![rapture_20210502220849.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/5cba4271-bf4a-96c1-b044-cd2fba56a005.png)
1. ファイル名欄に「/t1.xqy」を入れ
1. 用意した内容を入力
1. 「Save」ボタンを押下
![rapture_20210502221230-fix.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/e579da97-bf9e-5733-6c9a-5719e2faeba3.png)

#### 外部からクエリを呼び出す
外部からクエリ「/t1.xqy」を呼び出すために、 curl を使います。
※[Git Bash](https://gitforwindows.org/) に含まれる。

```bash
curl --anyauth --user admin:admin "localhost:8021/t1.xqy"
```
![rapture_20210502223202.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/3c6497db-6abd-7404-2010-141bf93d6501.png)
実行後、curl が終了せず止まっていることが分かります。これはクエリがデバッグ待ち状態にあることを意味します。

#### アタッチ
1. 設定ボタンをクリックし、最低限１つの編集窓を開いてる状態とします（バグ回避）
1. 「attach xqy」を選ばれたことを確認
1. 緑三角形を押下
1. 一覧から（１件だけ）選ぶ
![rapture_20210502225308.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/9f51d35f-8881-be70-6b19-ff8cc665333b.png)
すると、自動的にソースファイルが開かれ、デバッグ状態になります。
![rapture_20210502225708.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/272216d4-9b12-4e9d-d0c8-3596aed3ebaf.png)

#### 接続終了
作業終了後、接続を終了する。
※この操作忘れると、起動するクエリが自動で止まり動作しなくなります。
![rapture_20210502230037.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/af27ab67-696d-1a47-e075-c13e20306012.png)

## 3.JavaScriptに関する手順
### 3.1.設定の追加
![rapture_20210502230635.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/61c234c3-fb2e-1775-c8cc-549e2c52f0bf.png)
![rapture_20210502230816.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/0bbef505-a76b-24db-a2c8-1f9359087845.png)
設定ファイルにブロックが自動的に追加される。
![rapture_20210502231014.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/02b458ef-6f08-a3a4-ea79-64bd513d9044.png)

### 3.2.sjsデバッグ
![rapture_20210502231307.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/f88f0b98-8c8c-1373-e3af-c0de9eee6664.png)

step実行できるような状態になります。

### 3.3.sjsのアタッチ
#### 設定追加
上記と同じ手順で設定を追加
設定の「debugServerName」を上に設定した名前（この例では`debugHttpServer`）に修正する
![rapture_20210502232753.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/32239d15-4c5e-0db2-af55-cf2ed4e6229e.png)
#### サーバー接続
1. ctrl + shift + p でコマンドパレードを開き
1. 「MarkLogic: connect JavaScript Debug Server」を選ぶ
1. Xqueryの場合と違って一覧ではなく入力欄になります、サーバー名（この例は `debugHttpServer`、大文字小文字注意）を正確に入れると、接続成功になる
![rapture_20210502232250.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/a6f34cf2-a1e4-6538-ef7a-407f18ac8c71.png)

#### 外部からクエリを呼び出す
- 別窓で curl を実行する
- curlが途中に止まり、帰ってこない状態になる
![rapture_20210503005226.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/66f9a68f-18e3-89c3-abb4-e0aaba1a2afc.png)

#### アタッチ
1. 「Attach to Remote JavaScript Request」を選で
1. 緑の三角形を押下
1. 一覧からアタッチ対象を選び、アタッチされたことが確認できる
![rapture_20210503004907.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/2ec86b00-a660-6a47-1b8a-16e60b7311d2.png)

#### 接続終了
作業終了後、接続を終了する。
※この操作忘れると、起動するクエリが自動で止まり動作しなくなります。
![rapture_20210502230037.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/32912/af27ab67-696d-1a47-e075-c13e20306012.png)

以上