CircleCIでdocker-composeを使用して自動テストしてみた

#はじめに
今回は、CircleCi上でdocker-composeを使用して自動テストを導入してみました。CircleCi上ではRSpecのテストを行っています。ローカルのテスト環境用ocker-compose.ymlをそのまま使用しているので比較的簡単にCircleCiを導入できました。何かの参考になればと思い記事にしてみました。
尚、開発環境とテスト環境用の設定については以前記事にしているこちらを使用しています。
[DockerでNginx+unicorn+rails+Mysqlの開発環境を作ってみた](https://qiita.com/E6YOteYPzmFGfOD/items/509dbabeb20bf2487283)
[Docker+Rails+HeadlessChromeでRSpecのSystem Testしてみた](https://qiita.com/E6YOteYPzmFGfOD/items/905cce063b0d21a0eccb)

###参考にさせていただいた記事
[docker-composeでRailsを開発しCircleCI 2.0でテストしてHerokuにdeployする](https://qiita.com/Kesin11/items/47079bc7f659e71b694c)

###開発環境

```
Mac OS X 10.15.4

docker -v
Docker version 19.03.8, build afacb8b

docker-compose -v
docker-compose version 1.25.4, build 8d51620a
```

###前提条件
CircleCiの登録等はすでに完了済みとして進めさせていただきます。
CircleCiでSet up projectするところまで進めてください。
[Circleci公式](https://circleci.com/docs/ja/2.0/getting-started/)

#1.ファイル構成について

```
.(既存railｓプロジェクト)
├──.circleci
|   └──config.yml
├── Dockerfile
├── docker-compose.yml
├── Dockerfile.test
├── dockertest
|   └──docker-compose.test.yml
├── Gemfile
├── Gemfile.lock
├── config
|   └──datebase.yml
|   └──unicorn.conf.rb
└── nginx
     ├──Dockerfile 
     └──nginx.conf
```
上記のようなファイル構成で進めます。CircleCiで無駄なイメージを使用しないように開発環境用とは別にテスト環境用の
dockercompose.test.yml（Rails+Mysql+selenium_chromeの３つのコンテナ）を用意してます。selenium_chromeはRSpecのjsテスト用です。

#2.設定ファイル等
開発・テスト環境用の詳しい設定に関しては以前の記事を参考にしていただければと思います。テスト環境の各設定は下記のようになってます。

```dockerfile:Dockerfile(rails用)
#既存のプロジェクトのrubyのバージョンを指定
FROM ruby:2.6.3 

RUN apt-get update && \
    apt-get install -y --no-install-recommends\
    nodejs  \
    mariadb-client  \
    build-essential  \
    && apt-get clean \
    && rm -rf /var/lib/apt/lists/*

WORKDIR /var/www/rails/myapp

WORKDIR /myproject

COPY Gemfile /myproject/Gemfile
COPY Gemfile.lock /myproject/Gemfile.lock

RUN gem install bundler
RUN bundle install

COPY . /myproject
```

```yml:database.yml
※テスト環境用の設定を載せてます。
default: &default
  adapter: mysql2
  encoding: utf8
  pool: 5
  username: root
  password: password

test:
  <<: *default
  host: test-db
  database: docker_test
```

```yml.docker-compose.test.yml
version: '3'
services:
  web:
    build:
      context: ../
      dockerfile: Dockerfile.test
    depends_on:
      - test-db
      - selenium_chrome

  test-db:
    image: mysql:5.7
    command: mysqld --character-set-server=utf8 --collation-server=utf8_unicode_ci
    environment:
      MYSQL_DATABASE: docker_test
      MYSQL_ROOT_PASSWORD: password
      MYSQL_USER: root
      MYSQL_PASSWORD: password

  selenium_chrome:
    image: selenium/standalone-chrome-debug
    logging:
      driver: none
```

3.CircleCiの設定

```yml:config.yml
version: 2
jobs:
  build:
    # docker-composeがインストール済みの仮想マシンをプル
    machine:
      image: circleci/classic:edge
    steps:
      - checkout
      - run:
          name: Dockerコンテナのビルド
          command: docker-compose -f dockertest/docker-compose.test.yml build
      - run:
          name: Dockerコンテナの起動
          command: docker-compose -f dockertest/docker-compose.test.yml up -d
      - run:
          name: db接続を待機
          command: sleep 10
      - run:
          name: データベースのセットアップ
          command: docker-compose -f dockertest/docker-compose.test.yml exec web bundle exec rails db:migrate RAILS_ENV=test
      - run:
          name: Dockerコンテナの停止
          command: docker-compose -f dockertest/docker-compose.test.yml down
```
imageでdocker-composeをインストール済みの仮想マシン使用するようにしてます。macine: circleci/classic:edgeとすることで最新版のmacineを使用することができます。
[Circleciのdocker-composeの設定](https://circleci.com/docs/2.0/docker-compose/)
[macineのバージョン情報](https://circleci.com/docs/ja/2.0/configuration-reference/)
ただし、macineを使うと、今後有料になる可能性がある＋CircleCi CLIを使用しできません。（ローカルで動作テストできない。）
動作に関してはdocker-composeを使用してテストまでの流れを記載します。
dbの接続する際にdbのセットアップができる前にmigrateしようとしてエラーが発生するので10秒程待機時間を持たせています。（dockerizeを使用する方法もあるようですがうまくできなかったので苦肉の策でで待機時間を設けています。）

#終わりに
今回CircleCiの設定をしていてCircleCi CLIを使用できないのはかなりつらかったです。何度もgitにpushしていたので…

最後までお読みいただきありがとうございました！！！