ブラウザで動くアウトラインエディタを作った

Vue.jsをもうちょっと触っといた方がいいかな, ぐらいの軽い気持ちで作っていたけどNetlifyだと無料で配信できるし公開しておく.

bonsai-outliner.netlify.app

どう見たってWorkFlowyとかDynalistを使う方が良いのだが, ショートカットをUnixキーバインドっぽく仕上げたら思いの外便利になってしまった.

Google Driveへの保存機能も作っていたが, APIの利用申請にYou Tube動画の登録が必要になって面倒になってやめた. (利用するAPIを絞れば大丈夫そうだけど, ふつーのテキストファイルで保存したいのよなぁ.あとDrive API調べるの面倒...)

自分が使う分にはテキストファイルへのエクスポートとブラウザ内への保存だけで十分だし, 案外このまましばらく使い続けるかもしれない.

余談だけど普段買わないWEB+DB PRESSのVol.120にあったVue.jsの入門記事が大変役に立った.

自作OS×自作ブラウザの記事の方が興味があって買ったのに、結局読み込んだのはVueの記事になってしまった.

私のように大して難しい仕事をしない人はこの記事とGoogleだけでも結構使えるようになる気がする.おすすめ.

gihyo.jp

Vagrantのubuntu(ubuntu/bionic64)で12ステップで作る組込みOS自作入門の環境を作った時のメモ

h8writeとターミナルアプリは諦めてホストOSのものを使った. (Windowsでteratermとkz_h8write)

VirtualBoxからUSBやシリアルポートを使う方法もあるようなのだけど, どうもうまくいかない.

USB Type-Cしかないマシンなのでその影響が出ている気がしないこともない.

クロスコンパイル用のbinutilsとgccは著者のサイトから取得してきた.

$ sudo apt update
$ sudo apt upgrade
$ sudo apt install flex

# binutils
$ curl -OL http://kozos.jp/books/makeos/binutils-2.19.1.tar.gz
$ tar xfvz binutils-2.19.1.tar.gz
$ cd binutils-2.19.1/
$ ./configure --target=h8300-elf --disable-nls --disable-werror
$ make
$ sudo make install

# gcc
$ curl -OL http://kozos.jp/books/makeos/gcc-3.4.6.tar.gz
$ tar xfvz gcc-3.4.6.tar.gz
$ cd gcc-3.4.6/
$ vi gcc/collect2.c
# 書籍記載の内容通り変更
$ wget http://kozos.jp/books/makeos/patch-gcc-3.4.6-x64-h8300.txt
$ patch -p0 < patch-gcc-3.4.6-x64-h8300.txt
$ mkdir build && cd build
$ ../configure --target=h8300-elf --disable-nls --disable-threads --disable-shared --enable-languages=c --disable-werror
$ make
$ sudo make install

makeしたmotファイルをホスト側のh8writeで書き込めばとりあえずstep1はクリアできる.

VM便利だけど, いちいち面倒だしubuntuマシンが欲しくなる.

Laravel Duskで要素数を数えたり現れる順序をテストしたかった

直接的なアサーションがなかったから作った. TestCaseでuseして使うtraitにしてみた.

たぶんMacroを用意するのが正当なアプローチだと思うんだけど, 調べるの面倒で雑に書いてしまった.

<?php

namespace Tests;

use Facebook\WebDriver\WebDriverBy;

trait MyDuskAssertions
{
    /**
     * $selector要素が$count個あるかをassertionする
     * 
     * Usage:
     *   $this->myAssertElementsCountIs($browser, 'tbody>tr', 1);
     */
    public function myAssertElementsCountIs($browser, $selector, $count)
    {
        $elements = $browser->driver->findElements(WebDriverBy::cssSelector($selector));
        $this->assertCount($count, $elements);
    }

    /**
     * $textsが$selector内で順番に現れるかassertionする
     *
     * Usage:
     *   $this->myAssertSeeInOrder($browser, 'tbody td', ['No.1', 'No.2', 'No.3']);
     */
    public function myAssertSeeInOrder($browser, $selector, $texts)
    {
        $targets = $texts;
        $elements = $browser->driver->findElements(WebDriverBy::cssSelector($selector));
        $msg_texts = implode(',', $texts);

        foreach ($elements as $e) {
            $expect = reset($targets);

            if ($e->getText() == $expect || $e->getAttribute('value') == $expect) {
                array_shift($targets);
            }
        }
        $this->assertEmpty($targets, "'$msg_texts' were not see in order in '$selector'.");
    }
}

シェルスクリプトの中で一時的に別ユーザで実行したい

なんか毎度ググるからメモ.

sudo su - user <<EOF
pwd
echo "hoge hoge"
ls -al
EOF

Laravel duskでinput type dateの入力を行いたい

なんかチョットハマったので.

<input type="date" id="due_date">

に対してこうやりたいんだけど, どうもうまくいかない.

->type('#due_date', '2020-01-01')

調べるとこうやるらしい.

->keys('#due_date', '2020', '{tab}', '01', '01')

微妙に面倒.

Laravelでテストする時にパスワードの更新を確認する

パスワードのハッシュを確認するメソッドを毎回忘れる.

// Hashファサードがいるよね
use Illuminate\Support\Facades\Hash;

// 普通の項目は以下でテストできる
$this->assertDatabaseHas('users', [
    'name' => '更新した名前',
    'email' => '更新したメールアドレス',
]);

// パスワードの確認はHash::checkを使う
$registed_user = User::where('email', '更新したメールアドレス')->first();
$this->assertTrue(Hash::check('期待されるパスワード', $registed_user->password));

Laravel Duskでテストする時に毎回ログアウトしたい

なんか毎回ググってる気がするからメモっとく.

場合によっちゃDuskTestCase.phpに入れてもいいかもしれない.

public function setUp(): void
{
    parent::setUp();

    // 毎回ログアウトするためクッキーを消す
    foreach (static::$browsers as $browser) {
        $browser->driver->manage()->deleteAllCookies();
    }
}