🚗
OpenAIを利用して、CodeceptJSのテストコードを自動で書いてもらう
CodeceptJSのバージョン3.5.0にて、AI機能を追加したとのことだったので、試してみました。
CodeceptJSでのAIについて
必要なもの
- OpenAIのAPIトークン(有料アカウントが必要)
実行手順
-
npx create-codeceptjs .
コマンドでインストールします。 - openai_test.tsを作成し、以下のコードをコピペします。
openai_test.ts
Feature('ai');
Scenario.only('test ai features', ({ I }) => {
I.amOnPage('https://getbootstrap.com/docs/5.1/examples/checkout/')
pause();
});
-
OPENAI_API_KEY={APIトークン} npx codeceptjs run --debug
を実行します。 -
pause
に到達した段階から対話モードとなり、生成してほしいテストパターンを入力後、Enterキーを押下します。
E2E用のテストコードを書いてもらう
全てのフィールドに対して入力するテストコードを書いてもらいました。
依頼内容
I.fill all fields. Don't submit.
依頼結果
生成されたコード
各フィールドの要素を調査し、値を入力するテストコードを作成してくれています。
// Open the web page
I.amOnPage('/');
// Fill the first name field
I.fillField({ id: 'firstName' }, 'John');
// Fill the last name field
I.fillField({ id: 'lastName' }, 'Doe');
// Fill the username field
I.fillField({ id: 'username' }, 'johndoe');
// Fill the email field
I.fillField({ id: 'email' }, 'johndoe@example.com');
// Fill the address field
I.fillField({ id: 'address' }, '1234 Main St');
// Fill the address2 field
I.fillField({ id: 'address2' }, 'Apartment or suite');
// Select the country
I.selectOption({ id: 'country' }, 'United States');
// Select the state
I.selectOption({ id: 'state' }, 'California');
// Fill the zip field
I.fillField({ id: 'zip' }, '12345');
// Check the "Shipping address is the same as my billing address" checkbox
I.checkOption({ id: 'same-address' });
// Check the "Save this information for next time" checkbox
I.checkOption({ id: 'save-info' });
// Select the payment method (e.g., Credit card)
I.checkOption({ id: 'credit' });
// Fill the name on card field
I.fillField({ id: 'cc-name' }, 'John Doe');
// Fill the credit card number field
I.fillField({ id: 'cc-number' }, '1234567890123456');
// Fill the expiration field
I.fillField({ id: 'cc-expiration' }, '12/23');
// Fill the CVV field
I.fillField({ id: 'cc-cvv' }, '123');
// Click the "Continue to checkout" button
I.click({ css: '.btn-primary' });
日本語で入力してもらった結果
日本語で入力してもらいましたが、「John Doe」に代わる値で入力はしてもらえない感じでした。
日本語で依頼してみた
日本語で入力してくれましたが、違うそうじゃないって感じの結果が返ってきました😅
まとめ
便利そうではありますが、生成されるコードでもミスがあるので、注意が必要です。
実行に失敗したコードを自己修復してくれるプラグインがあったり、他の機能もあるので試したら紹介します。
Discussion