今回、コードを見直してそれらしき箇所をみつけ修正したが、相変わらず2回pushしないと全ファイルがアップされない。原因不明。

ブツ

インストール&実行

NAME='Electron.MyLog.git.push.await.20220907103921'
git clone https://github.com/ytyaru/$NAME
cd $NAME
npm install
npm start

準備

  1. GitHubアカウントを作成する
  2. repoスコープ権限をもったアクセストークンを作成する
  3. npm startでアプリ起動し終了する(db/setting.jsonファイルが自動作成される)
  4. db/setting.jsonに以下をセットしファイル保存する
    1. address:任意のモナコイン用アドレス
    2. username:任意のGitHubユーザ名(デフォルト値:git config --global user.name
    3. email:任意のGitHubメールアドレス(デフォルト値:git config --global user.email
    4. tokenrepoスコープ権限を持ったトークン
    5. repo.name:任意リポジトリ名(デフォルト値:ルートディレクトリ名+.Site
    6. 任意で以下もセットする
      1. repo.description: デフォルト値:著者のつぶやきサイトです。
      2. repo.homepage: (空なら自動でhttps://${username}.github.io/${repo.name}/
  5. dst/mytestrepo/.gitが存在しないことを確認する(あればdstごと削除する)
  6. GitHub上に同名リモートリポジトリが存在しないことを確認する(あれば削除するか別名にする)

実行

  1. npm startで起動またはアプリでCtrl+Shift+Rキーを押す(リロードする)
  2. git initコマンドが実行される
    • repo/リポジトリ名ディレクトリが作成され、その配下に.gitディレクトリが作成される
  3. [createRepo][]実行後、リモートリポジトリが作成される

GitHub Pages デプロイ

アップロードされたファイルからサイトを作成する。

  1. アップロードしたユーザのリポジトリページにアクセスする(https://github.com/ユーザ名/リポジトリ名
  2. 設定ページにアクセスする(https://github.com/ユーザ名/リポジトリ名/settings
  3. Pagesページにアクセスする(https://github.com/ユーザ名/リポジトリ名/settings/pages
    1. SourceのコンボボックスがDeploy from a branchになっていることを確認する
    2. Branchmasterにし、ディレクトリを/(root)にし、Saveボタンを押す
    3. F5キーでリロードし、そのページにhttps://ytyaru.github.io/リポジトリ名/のリンクが表示されるまでくりかえす(数分かかる
    4. https://ytyaru.github.io/リポジトリ名/のリンクを参照する(デプロイ完了してないと404エラー)

結果

経緯

Node.jsのAPIを介してgitコマンドを叩いたり、simple-gitパッケージを介して叩いたりした。けれど結局どちらも2回git pushしないと全ファイルがアップされないという謎の症状にみまわれた。

原因を考察する

端末でgitコマンドを叩くときはふつうに一発でアップされる。2回pushしないとアップされない症状など経験したことがない。よってgitコマンドの問題ではないはず。

なら、またしてもElectronやNode.js絡みの謎エラーなのか? 仮にそうだとして、一体何がどうなったら中途半端にアップされることになるのだろう。コマンドを間違えたらそもそも動作しないはずだし。想像できない。

となると、私の書いたコードが間違っているはず。ありえるとしたら最初に疑ったasync/await。ファイルのコピーが完了する前にpushされちゃった、とか。そういう話なら理解できる。もう一度コードを見直してみよう。

awaitまわりのコード

renderer.js

window.addEventListener('DOMContentLoaded', async(event) => {
    ....
    await maker.make()
    await git.push('新規作成')
    await git.push('なぜか初回pushではasset/ディレクトリなどがアップロードされないので2回やってみる') 
    ....
})

maker.make()でサイトに必要なファイル一式を作成している。それをawaitで完了するまで待機してからgit pushしている。なので、完了前にpushされて一部アップされない、といったことは起こらないはず。

なのに実際には起きちゃってる。もっと深くコードを追ってみよう。

site-maker.js

ファイル一式を作成するコード。

    async make() { // 初回にリモートリポジトリを作成するとき一緒に作成する
        await Promise.all([
            this.#cp(`css/`),
            this.#cp(`asset/`),
            this.#cp(`db/mylog.db`),
            window.myApi.cp(`LICENSE.txt`, `dst/${this.setting.github.repo.name}/LICENSE.txt`, {'recursive':true, 'preserveTimestamps':true}),
            this.#readMeCode(),
            this.#indexCode(),
            window.myApi.cp(`src/js/app/github/export/style.css`, `dst/${this.setting.github.repo.name}/css/style.css`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/app/github/export/main.js`, `dst/${this.setting.github.repo.name}/js/main.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/lib/sql.js/1.7.0/sql-wasm.min.js`, `dst/${this.setting.github.repo.name}/lib/sql.js/1.7.0/sql-wasm.min.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/lib/sql.js/1.7.0/sql-wasm.wasm`, `dst/${this.setting.github.repo.name}/lib/sql.js/1.7.0/sql-wasm.wasm`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/lib/toastify/1.11.2/min.css`, `dst/${this.setting.github.repo.name}/lib/toastify/1.11.2/min.css`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/lib/toastify/1.11.2/min.js`, `dst/${this.setting.github.repo.name}/lib/toastify/1.11.2/min.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/app/github/export/sqlite-db-loader.js`, `dst/${this.setting.github.repo.name}/lib/mylog/sqlite-db-loader.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/app/github/export/db-to-html.js`, `dst/${this.setting.github.repo.name}/lib/mylog/db-to-html.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/app/github/export/run_server.py`, `dst/${this.setting.github.repo.name}/run_server.py`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/app/github/export/server.sh`, `dst/${this.setting.github.repo.name}/server.sh`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/app/github/export/.gitignore`, `dst/${this.setting.github.repo.name}/.gitignore`, {'recursive':true, 'preserveTimestamps':true}),
            this.#mpurseSendButtonCode(),
            window.myApi.cp(`src/lib/party/party.min.js`, `dst/${this.setting.github.repo.name}/lib/party/party.min.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/util/party-sparkle-hart.js`, `dst/${this.setting.github.repo.name}/lib/monacoin/party-sparkle-image.js`, {'recursive':true, 'preserveTimestamps':true}),
            window.myApi.cp(`src/js/util/party-sparkle-image.js`, `dst/${this.setting.github.repo.name}/lib/monacoin/party-sparkle-hart.js`, {'recursive':true, 'preserveTimestamps':true}),
        ])

以下でawaitしていない箇所があった。もしや、このせいか?

    async #cp(path) {
        ...
        window.myApi.cp(src, dst, {'recursive':true, 'preserveTimestamps':true})
    }
    async #mpurseSendButtonCode() { // デフォルトのアドレスを指定値に変更したファイルを作成・上書きする
        ...
        window.myApi.writeFile(`${dstDir}/${file}`, code)
    }
    async #readMeCode() {
        ...
        window.myApi.writeFile(`${dstDir}/${file}`, code)
    }
    async #indexCode() { // GitHubリポジトリ名をURLにぶちこむ
        ...
        window.myApi.writeFile(`${dstDir}/${file}`, code)
    }
    async #sqliteDbLoaderCode() {
        ...
        window.myApi.writeFile(`${dstDir}/${file}`, code)
    }

コードのコメントアウトをみると以前はawaitしていたけど削除したようだ。

たぶん私の勘違いだろう。Promise.allの引数に渡すときawaitしてはならず、Promiseを渡さねばならない。それをなにか勘違いして、間違った箇所でawaitを削除してしまったのだろう。

以下のようにawaitを付与するようコードを修正した。

    async #cp(path) {
        ...
        await window.myApi.cp(src, dst, {'recursive':true, 'preserveTimestamps':true})
    }
    async #mpurseSendButtonCode() { // デフォルトのアドレスを指定値に変更したファイルを作成・上書きする
        ...
        await window.myApi.writeFile(`${dstDir}/${file}`, code)
    }
    async #readMeCode() {
        ...
        await window.myApi.writeFile(`${dstDir}/${file}`, code)
    }
    async #indexCode() { // GitHubリポジトリ名をURLにぶちこむ
        ...
        await window.myApi.writeFile(`${dstDir}/${file}`, code)
    }
    async #sqliteDbLoaderCode() {
        ...
        await window.myApi.writeFile(`${dstDir}/${file}`, code)
    }

これでawait Promise.all([...])の引数部分で上記メソッドを呼び出すときawaitしなければPromiseが返るはず。それら複数のPromiseallの引数として渡してやれば、すべて完了するまで待機するようになるはず。

これでよし。実際にアップロードしてみた。が、結局、変わらなかった……。

git.js

git.push()の中身もちゃんとawaitしてある。

    async push(message=null) {
        if (!message) { message = `追記:${new Date().toISOString()}` }
        let res = await this.#setUser()
        res = await this.#add()
        res = await this.#commit(message)
        res = await this.#push()
    }
    async #setUser(level='local') { // local, global, system
        if (!['local', 'global', 'system'].includes(level)) { alert(`db/setting.jsonファイルにGitHubユーザ名をセットしてください`, true); return false; }
        const res1 = await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}/"; git config --${level} user.name '${this.setting.github.username}';`)
        const res2 = await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}/"; git config --${level} user.email '${this.setting.github.email}';`)
        return res1.stdout + '\n' + res2.stdout
    }
    async #add() {
        return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git add .;`)
    }
    async #addList() {
        return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git add -n .;`)
    }
    async #commit(message) {
        return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git commit -m '${message}';`)
    }
    async #remoteAddOrigin() {
        return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git remote add ${this.remote} "https://${this.setting.github.username}:${this.setting.github.token}@github.com/${this.setting.github.username}/${this.setting.github.repo.name}.git";`)
    }
    async #remoteSetUrlOrigin() {
        return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git remote set-url ${this.remote} "https://${this.setting.github.username}:${this.setting.github.token}@github.com/${this.setting.github.username}/${this.setting.github.repo.name}.git";`)
    }
    async #push() {
        return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git push ${this.remote} ${this.branch}`)
    }
}

addcommitが完了する前にpushされちゃった、ということも起こらないはず。それぞれのコマンドでちゃんとawaitしているから。

ファイル作成とgitコマンドは、ちゃんとawaitしている。ならもうawaitは関係ないはず。一体なにが原因なんだ?

ログ

リポジトリ作成するとき2回pushするよう実装している。

await git.push('新規作成')
await git.push('なぜか初回pushではasset/ディレクトリなどがアップロードされないので2回やってみる') 

このときcommitも行う。そのときのログと思しきものが以下。

ログに出たファイル名を眺めていて思ったが、もしかしてindex.htmlでリンクされていない画像ファイルを除外しているのかな? gitコマンドにそんな余計なお節介する機能があるなんて聞いたことないけど。

1回目pushログ

[master (root-commit) 75e96dc] 新規作成
 21 files changed, 863 insertions(+)
 create mode 100644 .gitignore
 create mode 100644 LICENSE.txt
 create mode 100644 README.md
 create mode 100644 asset/image/avator.png
 create mode 100644 asset/image/eye-catch.png
 create mode 100644 css/style.css
 create mode 100644 db/mylog.db
 create mode 100644 index.html
 create mode 100644 js/main.js
 create mode 100644 lib/monacoin/mpurse-send-button.js
 create mode 100644 lib/monacoin/party-sparkle-hart.js
 create mode 100644 lib/monacoin/party-sparkle-image.js
 create mode 100644 lib/mylog/db-to-html.js
 create mode 100644 lib/mylog/sqlite-db-loader.js
 create mode 100644 lib/party/party.min.js
 create mode 100644 lib/sql.js/1.7.0/sql-wasm.min.js
 create mode 100644 lib/sql.js/1.7.0/sql-wasm.wasm
 create mode 100644 lib/toastify/1.11.2/min.css
 create mode 100644 lib/toastify/1.11.2/min.js
 create mode 100644 run_server.py
 create mode 100755 server.sh

じつは初回コミットだけは21ファイルしかコミットできない、とかいう制約があったりするのか? もしくはファイルサイズ上限? そんなの聞いたことがない。

2回目pushログ

頭の悪そうなコミットメッセージよ……。

[master c84041e] なぜか初回pushではasset/ディレクトリなどがアップロードされないので2回やってみる
 63 files changed, 470 insertions(+)
 create mode 100644 asset/image/github.svg
 create mode 100644 asset/image/mastodon_mascot.svg
 create mode 100644 asset/image/misskey.png
 create mode 100644 asset/image/monacoin/png/256/coin-mark-black.png
 create mode 100644 asset/image/monacoin/png/256/coin-mark.png
 create mode 100644 asset/image/monacoin/png/256/coin-mini-monar-mouth-red.png
 create mode 100644 asset/image/monacoin/png/256/coin-mini-monar.png
 create mode 100644 asset/image/monacoin/png/256/coin-monar-mouth-red.png
 create mode 100644 asset/image/monacoin/png/256/coin-monar.png
 create mode 100644 asset/image/monacoin/png/256/mark-outline.png
 create mode 100644 asset/image/monacoin/png/256/mark.png
 create mode 100644 asset/image/monacoin/png/256/monar-mark-white.png
 create mode 100644 asset/image/monacoin/png/256/monar-mark.png
 create mode 100644 asset/image/monacoin/png/256/monar-mouth-red.png
 create mode 100644 asset/image/monacoin/png/256/monar-no-face.png
 create mode 100644 asset/image/monacoin/png/256/monar-transparent.png
 create mode 100644 asset/image/monacoin/png/256/monar.png
 create mode 100644 asset/image/monacoin/png/64/coin-mark-black.png
 create mode 100644 asset/image/monacoin/png/64/coin-mark.png
 create mode 100644 asset/image/monacoin/png/64/coin-mini-monar-mouth-red.png
 create mode 100644 asset/image/monacoin/png/64/coin-mini-monar.png
 create mode 100644 asset/image/monacoin/png/64/coin-monar-mouth-red.png
 create mode 100644 asset/image/monacoin/png/64/coin-monar.png
 create mode 100644 asset/image/monacoin/png/64/mark-outline.png
 create mode 100644 asset/image/monacoin/png/64/mark.png
 create mode 100644 asset/image/monacoin/png/64/monar-mark-white.png
 create mode 100644 asset/image/monacoin/png/64/monar-mark.png
 create mode 100644 asset/image/monacoin/png/64/monar-mouth-red.png
 create mode 100644 asset/image/monacoin/png/64/monar-no-face.png
 create mode 100644 asset/image/monacoin/png/64/monar-transparent.png
 create mode 100644 asset/image/monacoin/png/64/monar.png
 create mode 100644 asset/image/monacoin/svg/coin-mark-black.svg
 create mode 100644 asset/image/monacoin/svg/coin-mark.svg
 create mode 100644 asset/image/monacoin/svg/coin-mini-monar-mouth-red.svg
 create mode 100644 asset/image/monacoin/svg/coin-mini-monar.svg
 create mode 100644 asset/image/monacoin/svg/coin-monar-mouth-red.svg
 create mode 100644 asset/image/monacoin/svg/coin-monar.svg
 create mode 100644 asset/image/monacoin/svg/mark-outline.svg
 create mode 100644 asset/image/monacoin/svg/mark.svg
 create mode 100644 asset/image/monacoin/svg/monar-mark-white.svg
 create mode 100644 asset/image/monacoin/svg/monar-mark.svg
 create mode 100644 asset/image/monacoin/svg/monar-mouth-red.svg
 create mode 100644 asset/image/monacoin/svg/monar-no-face.svg
 create mode 100644 asset/image/monacoin/svg/monar-transparent.svg
 create mode 100644 asset/image/monacoin/svg/monar.svg
 create mode 100644 asset/image/user/kkrn_icon_user_1.svg
 create mode 100644 asset/image/user/kkrn_icon_user_10.svg
 create mode 100644 asset/image/user/kkrn_icon_user_11.svg
 create mode 100644 asset/image/user/kkrn_icon_user_12.svg
 create mode 100644 asset/image/user/kkrn_icon_user_13.svg
 create mode 100644 asset/image/user/kkrn_icon_user_14.svg
 create mode 100644 asset/image/user/kkrn_icon_user_2.svg
 create mode 100644 asset/image/user/kkrn_icon_user_3.svg
 create mode 100644 asset/image/user/kkrn_icon_user_3_my.svg
 create mode 100644 asset/image/user/kkrn_icon_user_3_resize.svg
 create mode 100644 asset/image/user/kkrn_icon_user_3_resize_min.svg
 create mode 100644 asset/image/user/kkrn_icon_user_4.svg
 create mode 100644 asset/image/user/kkrn_icon_user_5.svg
 create mode 100644 asset/image/user/kkrn_icon_user_6.svg
 create mode 100644 asset/image/user/kkrn_icon_user_7.svg
 create mode 100644 asset/image/user/kkrn_icon_user_8.svg
 create mode 100644 asset/image/user/kkrn_icon_user_9.svg
 create mode 100644 asset/image/user/url.md

なぜこのファイルたちは1回目のpushでアップされないの? 謎。

この中にある.../png/64/coin-monar.pngファイルは、投げモナボタンの表示に使う画像なのに。

ついでにバグ修正

setting.js

末尾に改行コードが付与してしまうバグを発見したので修正した。shellコマンド実行結果の標準出力stdoutだと末尾に改行コードが付与されたままらしい。なのでtrim()した。

const username = await window.myApi.shell(`git config --global user.name`)
const email = await window.myApi.shell(`git config --global user.email`)
username:username.stdout.trim(),email:email.stdout.trim()

所感

結局、2回git pushしないと全ファイルがアップされない問題の原因はわからないまま。orz