OpenByt - 無料のWordPressに関する究極の情報源

ワードプレス自動テストと CI ガイド

WordPressを含むソフトウェア開発において、手動テストだけに頼る時代は終わりました。手動テストから自動テストへの移行は、ソフトウェア開発チームの進化するニーズへの対応です。この記事では、なぜこのような移行が起こったのか、WordPress 開発における自動テストと継続的インテグレーション(CI)の利点、そしてこれらのプラクティスを効果的に実装する方法について、初心者にもわかりやすく、かつ詳細に説明します。

1.WordPressにおける手動テストから自動テストへの移行

手動テストは、アプリケーションがどのように動作するかを理解するために不可欠ですが、多くの限界があります。時間がかかり、多くのリソースを必要とし、特に反復的なシナリオでは、ヒューマンエラーになりやすいのです。

自動テストは、WordPress アプリケーションのテストに迅速かつ効率的で一貫性のある方法を提供することで、これらの問題に対処します。シンプルなブログから複雑な会員制ウェブサイトまで、自動テストは時間を節約し、エラーを減らし、ウェブサイトが意図したとおりに機能するよう支援します。

1.1 自動テストに移行する理由

2.WordPress開発における自動テストとCI/CDのメリット

自動テストと継続的インテグレーション/継続的デプロイメント(CI/CD)は、高品質の WordPress ウェブサイトを維持するために不可欠です。

3.WordPressの自動テストのための主なツール

WordPress の自動テストを効率化するために、いくつかのツールを使用することができます。これらのツールは、コードの品質を保証し、プラグインの互換性をチェックし、開発サイクルの早い段階で問題を特定するのに役立ちます。

3.1 PHPUnit

PHPUnit は、WordPress のコア開発チームが PHP コードをテストするために承認した公式のテストフレームワークです。プラグインやテーマの安定性を保証する堅牢なツールです。

PHPUnit のステップバイステップのセットアップ:

1.PHPUnitをインストールします:

PHPUnit を Composer からインストールします。以下のコマンドを実行してインストールします:

composer require --dev phpunit/phpunit

理由:Composer を使うことで、WordPress の環境に対応した PHPUnit のバージョンを確保することができます。

2.WordPressのテストリポジトリをクローンします:

WordPressのテストリポジトリをクローンして、隔離されたテスト環境を作成します。クローンするには Git または SVN を使ってください:

git clone https://github.com/WordPress/wordpress-develop.git

理由:本番環境に影響を与えることなく WordPress のコードをテストするために必要なファイルと環境を提供します。

3.テスト環境を設定します:

4.PHPUnitテストを実行します:

以下のコマンドでテストを実行します:

./vendor/bin/phpunit

理由:テストを実行することで、開発プロセスの早い段階でバグを特定し、コードの品質を向上させ、デプロイ時の問題を減らすことができます。

PHPUnit は、プラグインやテーマのバックエンド機能をテストし、開発者に詳細なフィードバックを提供するのに理想的です。

3.2 WP-CLI

WP-CLI は WordPress 用のコマンドラインインターフェイスで、 PHPUnit テストの設定や管理を簡単にします。

WP-CLIを使ったテストの設定:

1.WP-CLIをインストールします:

curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
chmod +x wp-cli.phar
mv wp-cli.phar /usr/local/bin/wp

理由:WP-CLIはWordPressのインストールを管理するための高速な方法を提供し、特にテスト環境のセットアップのような反復的なタスクに便利です。

2.プラグインテストファイルの生成

WP-CLIを使用して、プラグインのユニットテストファイルを作成します:

wp scaffold plugin-tests my-plugin

理由:について wp scaffold プラグイン-テスト コマンドは、テストを開始するために必要なすべてのファイルを作成し、時間を節約します。

3.テストデータベースのセットアップ

本番データに影響を与えずにユニットテストを実行するために、別のテストデータベースを作成します:

bash bin/install-wp-tests.sh wordpress_test root '' localhost

チップ:本番サイトのデータが誤って変更されるのを防ぐため、常に専用のテスト用データベースを使用してください。

4.テストの実行

3.3 エンド・ツー・エンド・テストのためのサイプレス

サイプレス は、WordPress ウェブサイトのエンドツーエンドのテストを作成するためのオープンソースのフレームワークです。特に、ウェブサイトがユーザーとどのように相互作用するかをテストするのに便利です。

サイプレスの設定方法:

1.サイプレスをインストール

npm経由でCypressをインストールします:

npm install cypress --save-dev

理由: Cypress is designed for end-to-end testing, which means it tests your website’s entire workflow, providing insights into user interactions.

2.サイプレスの設定

Cypress は、次のような必要なファイルとフォルダを自動的に作成します。 cypress.jsonフレームワークをセットアップするためのファイルです。このファイルはプロジェクトのニーズに合わせて設定することができます。

チップ:カスタマイズ ベースURLcypress.json をテスト環境にあわせて変更してください。

3.テストを書く

Cypress では、JavaScript を使用してテストスクリプトを記述します。例えば、ログインページをテストする場合:

describe('Login Test', () => {
  it('should log in successfully', () => {
    cy.visit('https://example.com/login');
    cy.get('input[name="username"]').type('user');
    cy.get('input[name="password"]').type('password');
    cy.get('button[type="submit"]').click();
    cy.contains('Dashboard').should('be.visible');
  });
});

理由:サイプレスでは、初心者でもテストケースを簡単に作成・理解できるよう、明確な構文を提供しています。

4.テストの実行

を使用してサイプレスのテストを実行します:

NPXサイプレスオープン

チップ:サイプレスのUIは、各テストステップを視覚的に表現し、デバッグを容易にします。

サイプレス は、ユーザーのインタラクションをテストするための非常に視覚的でインタラクティブな方法を提供し、フロントエンドのテストに特に効果的です。

3.4 Behavior-Driven Development(BDD)のためのBehat

ベアト は行動駆動開発(BDD)に焦点を当てたフレームワークで、WordPress のユーザー体験をテストするのに最適です。

Behatの設定:

1.Behatをインストールします:

Composerを使ってBehatをインストールします:

composer require --dev behat/behat

理由:Behatを使用すると、WordPressアプリケーションの動作を自然言語でテストすることができ、機能がビジネス要件を満たしていることを確認できます。

2.Behatの設定

を作成します。 behat.yml 設定ファイルです:

デフォルト
  スーツ:
    デフォルト
      コンテキスト:
        - FeatureContext
  extensions:
    BehatMinkExtension:
      base_url: http://localhost
      selenium2: ~

チップ:ブラウザの自動化にMinkExtensionを使用することで、ユーザーインタラクションのシミュレーションが容易になります。

3.ガーキンでシナリオを書く

BehatはGherkinというユーザーの行動を記述する言語を使っています。例えば

特徴ユーザーログイン
  シナリオログイン成功
    私が"/login "にいるとします。
    username "を "user "と入力し
    パスワード "を "password "と入力し
    そして "Login "を押します。
    すると、"ダッシュボードへようこそ "と表示されます。

理由:ガーキンで書くことで、非技術的な利害関係者がテスト内容を理解することができます。

4.テストの実行

を使用してBehatを実行します:

ベンダー/bin/behat

チップ:テストを頻繁に実行することで、予想される動作と実際の動作の不一致を特定することができます。

ベアト は、エンドユーザーのシナリオに焦点を当てることで、WordPressウェブサイトがビジネス要件を満たしていることを確認するのに理想的です。

3.5 総合検査のためのコードレセプション

コードレセプション により、開発者は単体テスト、機能テスト、受け入れテストのすべてを 1 つのツールで実施でき、WordPress プロジェクトの包括的なテストを提供できます。

Codeceptionの設定方法:

1.Codeceptionをインストールします:

Composerを使用してCodeceptionをインストールします:

composer require codeception/codeception --dev

理由:Codeceptionは様々なテストをサポートしており、WordPressの総合的なテストに多目的に利用できます。

2.Codeceptionを初期化します:

初期化コマンドを実行し、Codeceptionをセットアップします:

vendor/bin/codecept bootstrap

チップ:Codeceptionを初期化すると、テストスイートごとに必要なフォルダ構造が作成されます。

3.テストスイートの設定

4.テストを書く

Codeceptionは、さまざまなシナリオをテストするためのPHPベースのテストスクリプトをサポートしています:

wantTo('ensure that login works');
$I->amOnPage('/login');
$I->fillField('username', 'user');
$I->fillField('password', 'password');
$I->click('Login');
$I->see('Dashboard');

チップ:説明的なテスト名を使用することで、テストの意図や結果を理解しやすくなります。

5.テストの実行

vendor/bin/codecept run

コードレセプション は、さまざまなテストを単一のワークフローにまとめ、複雑な WordPress プロジェクトを堅牢に検証します。

4.テストツールと開発環境の統合

Integrating automated testing tools with development environments helps streamline and enhance testing processes. Here’s how you can incorporate these tools into different environments:

モバイルバージョン終了