Open1

生成AIで、テストコード作成 gemini, deepseek

knaka Tech-Blogknaka Tech-Blog

概要

  • 最近の生成AIで、テストコード作成 するメモです。
  • フロント側で、selenium JS版 使う例です。
  • gemini, deepseek (web版) 使います。

環境

  • selenium JS版
  • node 20
  • AI : gemini, deepseek
  • chrome ブラウザ
  • vite
  • React

関連


テスト用のアプリ

  • 生成AIで作成した、 form画面など準備しておく。

  • selenium add
npm install selenium-webdriver
  • package.json
{
  "name": "test",
  "version": "1.0.0",
  "main": "t1.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "assert": "2.1.0",
    "selenium-webdriver": "^4.28.1"
  }
}


プロンプト

  • 1項目のみ、自動入力する例
コード生成して欲しい。
selenium javascript で、テスト コードを作成して欲しい

INPUT タグに、データを入力したい。
・項目 (name属性) は、下記
title: 文字数、10桁以下

※ 添付のコードを、参考にして欲しい

  • 生成AI画面で、添付する。サンプル用テストコード

https://gist.github.com/kuc-arc-f/fcfa1691971244f9d5433cd3cda89e77


  • 生成AI の、出力コード
const { By, Builder, Browser } = require('selenium-webdriver');
const assert = require('assert');

(async function testInputField() {
  let driver;

  try {
    // Chromeブラウザを起動
    driver = await new Builder().forBrowser(Browser.CHROME).build();
    
    // テスト対象のページにアクセス
    await driver.get('http://localhost:5173');

    // 暗黙的な待機時間を設定
    await driver.manage().setTimeouts({ implicit: 500 });

    // name属性が'title'のINPUTタグを取得
    let textBox = await driver.findElement(By.name('title'));

    // 10桁以下の文字列を入力
    const inputText = 'Selenium-123';
    await textBox.sendKeys(inputText);

    // 入力された値を取得
    const enteredValue = await textBox.getAttribute('value');

    // 入力された値が10桁以下であることを検証
    assert.ok(enteredValue.length <= 10, '入力された文字列が10桁を超えています');

    console.log('テスト成功: 入力された文字列は10桁以下です');

  } catch (e) {
    console.error('テスト失敗:', e);
  } finally {
    // ブラウザを閉じる
    if (driver) {
      //await driver.quit();
    }
  }
})();

  • 実行結果 , テスト値が 入力されました。

次のプロンプト

  • 前回より、入力の項目数を増やします。
  • 手順は、前と同様です。
コード生成して欲しい。
selenium javascript で、テスト コードを作成して欲しい

INPUT タグに、データを入力したい。
・項目 (name属性) は、下記
title: 適当な文字を入力、10桁以下
content: 適当な文字を入力、10桁以下
public_type: 公開 を選択
food_orange: チェックを ONにする
food_apple: チェックを ONにする
food_banana: チェックを ONにする
pub_date1: 日付を入力 (YYYY-MM-DD)
pub_date2: 日付を入力 (YYYY-MM-DD)
pub_date3: 日付を入力 (YYYY-MM-DD)
qty1: 適当な数字を入力
qty2: 適当な数字を入力
qty3: 適当な数字を入力

※ 添付のコードを、参考にして欲しい

  • 生成AI の、出力コード
const { By, Builder, Browser } = require('selenium-webdriver');
const assert = require('assert');

(async function testInputFields() {
  let driver;

  try {
    // Chromeブラウザを起動
    driver = await new Builder().forBrowser(Browser.CHROME).build();
    
    // テスト対象のページにアクセス
    await driver.get('http://localhost:5173');

    // 暗黙的な待機時間を設定
    await driver.manage().setTimeouts({ implicit: 500 });

    // title に入力 (10桁以下の文字列)
    const titleInput = await driver.findElement(By.name('title'));
    await titleInput.sendKeys('Selenium123');

    // content に入力 (10桁以下の文字列)
    const contentInput = await driver.findElement(By.name('content'));
    await contentInput.sendKeys('TestContent');

    // public_type を「公開」に設定
    const publicTypeInput = await driver.findElement(By.css('input[name="public_type"][value="public"]'));
    await publicTypeInput.click();

    // food_orange をチェック
    const foodOrangeInput = await driver.findElement(By.name('food_orange'));
    if (!(await foodOrangeInput.isSelected())) {
      await foodOrangeInput.click();
    }

    // food_apple をチェック
    const foodAppleInput = await driver.findElement(By.name('food_apple'));
    if (!(await foodAppleInput.isSelected())) {
      await foodAppleInput.click();
    }

    // food_banana をチェック
    const foodBananaInput = await driver.findElement(By.name('food_banana'));
    if (!(await foodBananaInput.isSelected())) {
      await foodBananaInput.click();
    }

    // pub_date1 に日付を入力 (YYYY-MM-DD)
    const pubDate1Input = await driver.findElement(By.name('pub_date1'));
    await pubDate1Input.sendKeys('2023-10-01');

    // pub_date2 に日付を入力 (YYYY-MM-DD)
    const pubDate2Input = await driver.findElement(By.name('pub_date2'));
    await pubDate2Input.sendKeys('2023-10-02');

    // pub_date3 に日付を入力 (YYYY-MM-DD)
    const pubDate3Input = await driver.findElement(By.name('pub_date3'));
    await pubDate3Input.sendKeys('2023-10-03');

    // qty1 に数字を入力
    const qty1Input = await driver.findElement(By.name('qty1'));
    await qty1Input.sendKeys('10');

    // qty2 に数字を入力
    const qty2Input = await driver.findElement(By.name('qty2'));
    await qty2Input.sendKeys('20');

    // qty3 に数字を入力
    const qty3Input = await driver.findElement(By.name('qty3'));
    await qty3Input.sendKeys('30');

    // 入力された値を検証
    assert.strictEqual(await titleInput.getAttribute('value'), 'Selenium123', 'title の入力値が正しくありません');
    assert.strictEqual(await contentInput.getAttribute('value'), 'TestContent', 'content の入力値が正しくありません');
    assert.strictEqual(await publicTypeInput.isSelected(), true, 'public_type が「公開」に設定されていません');
    assert.strictEqual(await foodOrangeInput.isSelected(), true, 'food_orange がチェックされていません');
    assert.strictEqual(await foodAppleInput.isSelected(), true, 'food_apple がチェックされていません');
    assert.strictEqual(await foodBananaInput.isSelected(), true, 'food_banana がチェックされていません');
    assert.strictEqual(await pubDate1Input.getAttribute('value'), '2023-10-01', 'pub_date1 の入力値が正しくありません');
    assert.strictEqual(await pubDate2Input.getAttribute('value'), '2023-10-02', 'pub_date2 の入力値が正しくありません');
    assert.strictEqual(await pubDate3Input.getAttribute('value'), '2023-10-03', 'pub_date3 の入力値が正しくありません');
    assert.strictEqual(await qty1Input.getAttribute('value'), '10', 'qty1 の入力値が正しくありません');
    assert.strictEqual(await qty2Input.getAttribute('value'), '20', 'qty2 の入力値が正しくありません');
    assert.strictEqual(await qty3Input.getAttribute('value'), '30', 'qty3 の入力値が正しくありません');

    console.log('テスト成功: すべてのフィールドに正しく入力されました');

  } catch (e) {
    console.error('テスト失敗:', e);
  } finally {
    // ブラウザを閉じる
    if (driver) {
      //await driver.quit();
    }
  }
})();

  • 実行結果
  • date型が、一部 失敗しましたが。他は問題ないようでした。

まとめ

  • 通常は。入力値が多くなると、テスト時間が増える傾向になるようなので。
  • まだ工夫は、必要と思いますが。
  • 生成AIを、活用して自動化できるのは。よさそうです。