テストコード

[stakiran]

lint にせよ refactoring にせよ、ガッと修正した後でも動くことをさっと確認したい。

サマリー

• テストコード書くために、thenable なコードになっている必要があった（が全然なってなかった）
• 数日かけてガッツリやった
• mocha によるテストコードの仕組み自体はつくってある
• 続きは #20 で

task

• [x] テストコード実行できるようにする
• [x] mocha で非同期テスト書けるようにする
• こっから https://github.com/tritask/tritask-vscode/tree/testcode で一通りやる
• [x] add でワンパス通してみる
• ==== テストコード書けないので thenable base に修正 ====
• [x] 1: 各関数および CursorMover を thenablePromise<boolean> で return させる
• [x] Promise せざるをえない場所の対処
  • :rabbit: 気の所為ならそれでいい（Thenableベースの途中でPromiseになるからテストコードダメかもという懸念 Promise に統一する。then() の中で resolve することで変換する
  • [x] edit().then(){ この中で return false or true する場合}
  • [x] endTask で、edit する前に end 不要で return する場合
• [x] 2: doSave に依存しているやつは全部 async funtion にして、await doSave() で待ち合わせる
• (ここができたら await 対応ワンパス)
• [x] 3: copyTask まわりを await で待ち合わせる
• ……

[stakiran]

どうやるんだろうなぁ。

やってることが基本的に

• helper.py 呼び出して trita ファイルいじらせる
• vscode.window.activeTextEditor 使ってテキストやカーソルを取得したり動かしたり

で、unittest 書きづらいんだよなぁ。

vscode.window.activeTextEditor にモック差し込んだりとかできたりする？

[stakiran]

いや、普通に「VSCode ウィンドウ新たに立ち上げて、a.trita 開いて、所定の操作させて、最後にカーソル位置やテキストの内容をgetしてassertする」

↑ これできる気がする

[stakiran]

テストコード実行するたびにいちいちウィンドウ新たに立ち上がる感じ（GUIテスト）になるけど、それでも手作業よりははるかに良い。

[stakiran]

書くとしたら

日付が変わると並び順が変わるので、テスト時に毎回ゼロからデータをつくるようにする

• add する
• (addの結果をテストする)
• copy する
• (copyの結果をテストする)
• ……
• sort する
• (sortの結果をテストする)
• カーソル移動系操作1
• (カーソル移動系操作1の結果をテストする)
• ……

[stakiran]

mocha 思い出す

mocha における describe it before beforeEach after afterEach の実行順序 - Qiita

テストコードは既に yo code のおかげで実行できるようになってる

• src\test\suite\extension.test.ts これが実行されるようになってる
  • 正式には glob('**/**.test.js' なので、src 配下に *.test.js 置いたら全部実行される
• launch の Extension Tests を実行すれば良い
• 実行すると
  • 1: vscode window 新しく立ち上がる
  • 2: テストコード走る
  • 3: デバッグコンソールに結果出る
  • 4: テスト終わったら window もばいちゃ

少しおためし

import * as assert from 'assert';
import { describe, before, after, beforeEach, afterEach, it } from 'mocha';

import * as vscode from 'vscode';

// import * as myExtension from '../extension';

suite('Extension Test Suite', () => {
    before(() => {
        vscode.window.showInformationMessage('Start all tests.');
    });

    test('Sample test', () => {
        assert.strictEqual(-1, [1, 2, 3].indexOf(5));
        assert.strictEqual(-1, [1, 2, 3].indexOf(0));
    });
});

describe('describe1', () => {
    before(() => {
        console.log('before')
    });

    after(() => {
        console.log('after')
    });

    beforeEach(() => {
        console.log('before')
    });

    afterEach(() => {
        console.log('after')
    });

    it('test1', () => {
        assert.strictEqual(1, 100-98-1);
    });

    it('test2', () => {
        assert.strictEqual(2, 100-98);
    });

});

describe('describe2', () => {
    it('test3', () => {
        assert.strictEqual(1, 100-98-1);
    });
});

  Extension Test Suite
    √ Sample test
  describe1
2
before
    √ test1
after
before
    √ test2
2
after
  describe2
    √ test3
  4 passing (79ms)

[stakiran]

suite と test って何？describe や it じゃダメなの？

[stakiran]

Testing Extensions | Visual Studio Code Extension API

記述なさそう。たぶん単に「suite がスイート表してて、テストケースは test が使えるよ（mochaデフォの describe と it はわかりづらいけどこれならわかりやすいやろ？）」ってことかな

[stakiran]

うん、suite は describe の、test は it のシンタックスシュガーっぽい

[stakiran]

chaiは？

まあ assert あるし、いったんこれでいいか

[stakiran]

テストコードから test.trita(空ファイル) を開くには？

[stakiran]

VS Code API | Visual Studio Code Extension API

vscode.window.openNewFile() ← こんなんがあるはず

[stakiran]

開いたかどうか見れないんだが。

function pause(){
    const commandLine = "pause"
    exec(commandLine, (err) => {
        if(err){
            console.log(err);
        }
    });
}

function sleep(msec: number){
    setTimeout(() => {}, msec)
}

pause でも setTimeout でも構わず終了しやがる

[stakiran]

あとかれんとでぃれくとりもわからん。

        console.log(vscode.workspace.name)
        console.log(vscode.workspace.workspaceFolders)

undefined だし。まず workspace folder を開く必要がある？

[stakiran]

https://code.visualstudio.com/api/references/vscode-api#TextDocument

activeTextEditor.document.fileName で「untitled 1」まで取れた。

が、ディレクトリはないっぽいな。

今が src/test/suite/extension.test.ts なんだが、src を得るにはどうしたらいいんだ？

[stakiran]

        console.log(vscode.workspace.name)
        console.log(vscode.workspace.workspaceFolders)
        console.log(IDE.getEditor().document.fileName)
        console.log(vscode.workspace.asRelativePath('123')) // workspace folder とやらがないから 123 がそのまま帰る

その workspace folder のパスが知りたいんやが

[stakiran]

console.log(vscode.env.appRoot)

ちゃう。c:\Program Files\Microsoft VS Code\resources\app が出た。

……いや、実行時にここに各種ファイルがコピーされてくるから、ここ基点で進めればええってこと？

[stakiran]

いや、違うね

[stakiran]

今が src/test/suite/extension.test.ts なんだが、src を得るにはどうしたらいいんだ？

これが欲しい。src/test/suite/test.trita を開きたいんですけども……

[stakiran]

        console.log(vscode.env.appRoot)
        console.log(vscode.env.shell)
        console.log(vscode.workspace.name)
        console.log(vscode.workspace.workspaceFile)
        console.log(vscode.workspace.workspaceFolders)
        console.log(IDE.getEditor().document.fileName)
        console.log(IDE.getEditor().document.uri.fsPath)
        console.log(vscode.workspace.asRelativePath('123'))

マジで正解どれなん……？

[stakiran]

javascript - VS Code extension - get full path - Stack Overflow

ググってもこれしか出てこない。

その workspace folder が空なんですよ。

[stakiran]

.../src/test/suite/extension.test.ts を実行してるんだから、.../src/test/suite/ を得る手段が絶対あるはずだと思うんだが

[stakiran]

https://code.visualstudio.com/api/working-with-extensions/testing-extension#the-test-script

[stakiran]

path さんでしたか

console.log(path.resolve(__dirname))

d:\work\github\stakiran_sub\tritask-vscode-PUBLIC\tritask-language-features\out\test\suite

[stakiran]

だが out 側に test.trita などテスト用ファイルがない

[stakiran]

node.js で絶対パスや相対パスを取得する方法 npm __dirname

[stakiran]

やっとできた

[stakiran]

import * as path from 'path'

class Path {
    static get _entrypoint(){
        // __dirname には現在実行中のソースコードが格納されているディレクトリ.
        // node.js の動作.
        // src/test/suite/test.ts の場合, out/test/suite になる
        return path.resolve(__dirname)
    }

    static get root(){
        const defaultRoot = this._entrypoint
        return path.resolve(defaultRoot, '..', '..', '..', 'src', 'test', 'suite')
    }
}

わりかししんどい。 Path.root にあたるパスを一発で取得できるシステム変数があってもばちあたらんと思うが

[stakiran]

ソースコード extension.ts を import する方法がわからん……

import * as tritask from '../../../src/extension'

これだと型定義なくてダメ。

const tritask = require('../../../src/extension.ts')

これだと SyntaxError: Cannot use import statement outside a module

[stakiran]

// import * as myExtension from '../extension';

yo code のテンプレはこれを出してる

[stakiran]

ぐぐると「型が存在してない」的な内容がヒットする……

ちゃんと定義してんだけどなぁ。それとも <string>SELF_EXTENSION_ID= みたいにしてないから認識されてない？

[stakiran]

typescript わからんからわからん

[stakiran]

あ、export してないからだ

[stakiran]

あと console.log がダメ

Error: Cannot find module '../../../src/extension'
Require stack:
……

[stakiran]

ダメだぁ、歯が立たない。付け焼き刃だときっついなぁ。 https://code.visualstudio.com/api/references/vscode-api 程度の情報量だとわからん

[stakiran]

extention.ts

 export {
     getSelfDirectory
 }

extention.test.ts

import * as tritask from '../../../src/extension';

        tritask.getSelfDirectory()

これでエラー無く通ったけど、デバッグコンソールに何も表示されなくなった……

[stakiran]

いや、エラー出てた（出たり出なかったりする）

Error: Cannot find module '../../../src/extension'
Require stack:
- d:\work\github\stakiran_sub\tritask-vscode-PUBLIC\tritask-language-features\out\test\suite\extension.test.js
- d:\work\github\stakiran_sub\tritask-vscode-PUBLIC\tritask-language-features\node_modules\mocha\lib\mocha.js
- d:\work\github\stakiran_sub\tritask-vscode-PUBLIC\tritask-language-features\node_modules\mocha\index.js
- d:\work\github\stakiran_sub\tritask-vscode-PUBLIC\tritask-language-features\out\test\suite\index.js
- c:\Program Files\Microsoft VS Code\resources\app\out\vs\loader.js
- c:\Program Files\Microsoft VS Code\resources\app\out\bootstrap-amd.js
- c:\Program Files\Microsoft VS Code\resources\app\out\bootstrap-fork.js

[stakiran]

わけわかんね

[stakiran]

https://code.visualstudio.com/api/references/vscode-api さんが import * as myExtension from '../extension の myExtension を使う例を書いてくれたらありがたいんだが

[stakiran]

どっか拡張機能のソースでも漁るかいね

[stakiran]

vscode-eslint

https://github.com/microsoft/vscode-eslint/blob/master/client/src/tests/glob.test.ts

[stakiran]

• vscode-eslint/client/src/tests/glob.test.ts
  • import { convert2RegExp } from '../utils';

export function convert2RegExp(pattern: string): RegExp | undefined {
    const separator = process.platform === 'win32' ? '\\\\' : '\\/';
    const fileChar = `[^${separator}]`;
    function convertNode(node: Node): string {

なるほど、外から使わせたい関数は export つけて定義しちゃうのか（まあ当たり前か

[stakiran]

ダメっす

import { getSelfDirectory } from '../../../src/extension';

        getSelfDirectory()

Error: Cannot find module '../../../src/extension'

これが出る

[stakiran]

Cong! :smile:

import { getSelfDirectory } from '../../extension'; // ★ ../../../src/extension だとなぜかダメ（VSCode 上ではエラー出なかったのに）
        console.log(getSelfDirectory())

.. 入りの相対パスは「最低限の長さ」で書くべきってことかな。

たぶん node,js だか vscode だがのそのへんのパスの組み立て処理が（無駄に .. を重ねる書き方に）対応してない。

• :o: ../../extension
• :x: ../../../src/extension
  • 上と同じ意味だが、内部的な組み立て処理がなんかミスって正しく解決できていない（のだと思われる
  • もっというと
    • VSCodeエディタ上では解決できてる が、テストコード実行時は解決できてない
    • :rabbit: そりゃハマるンゴ……

[stakiran]

https://github.com/tritask/tritask-vscode/commit/5aa2f7b0bd3406a28046cca511ee32501bd9d671

ほい、テスト用ファイル開くワンパスできた（長かった……

[stakiran]

vscode.workspace.openTextDocument(TESTEE_FULLLPATH) 失敗したときってどうやって検出するん？

Thenable とのことだが、catch() 書くとエラーになる。

[stakiran]

ああ、そうだった、普通に onfulfilled と onrejected を並べて定義すればいいだけだった

then().catch() の書き方しか使ってなかったから

[stakiran]

非同期の書き方しないとあかんな

[stakiran]

https://code.visualstudio.com/api/working-with-extensions/testing-extension#custom-setup-with-vscodetest

async function main() {
  try {
    // ★ここでテストコードのファイルパスつくって
    const extensionDevelopmentPath = path.resolve(__dirname, '../../../');
    const extensionTestsPath = path.resolve(__dirname, './suite/index');
    const vscodeExecutablePath = await downloadAndUnzipVSCode('1.40.1');
    const cliPath = resolveCliPathFromVSCodeExecutablePath(vscodeExecutablePath);

……

    // ★ここで指定して
    await runTests({
      // Use the specified `code` executable
      vscodeExecutablePath,
      extensionDevelopmentPath,
      extensionTestsPath
    });
  } catch (err) {
    console.error('Failed to run tests');
    process.exit(1);
  }
}

// ★async function を呼び出す形にする
main();

[stakiran]

いや、これは単に main() の中が終わるまで待ってるってだけか

[stakiran]

suite() や test() 使ってる中で、async await で制御していきたいんだが