49319


クロスワードのようにエクセルのセルのようなマスに数値を入れて、真偽をチェックするアプリの効率的なテスト方法はありませんか？

セルのinput要素に、自分でたくさんの数値を毎回入れて、うまく動かなかったら、修正して、また、入れ直すという作業が大変です。

もちろん始めは、すべてinput要素のvalueに数値をいれて、うまくいったら、空のセルを作って、もう一度、自分でアプリのユーザーと同じように、数値を入れてちゃんと正しい真偽チェックするという方法は自分でも考えられるのですが、もっと効率的に行う方法はないでしょうか？

すべてinput要素のvalueに数値をいれて、からまた、削除するというのが大変すぎます。

jsで作っています。

最後に、実際にtableタグのなかにあるinput要素に、大変な思いをして、数値をすべて入れたのですが、エラーが出てしまいました。リロードすると、数値が消えてしまうのですが、これを保存しておいたり、簡単にコピペできるようにする、ないしはコピペする方法はないでしょうか？

ブラウザ上で、コピペしたのですが、一列の文字列になってしまいました。


CC BY-SA 4.0
2018-10-13T03:55:50.023
49237
2018-10-15T22:07:43.777
2018-10-13T05:22:38.523
24247
24247
question
javascript html
エクセルのセルのようなマスに数値を入れて、真偽をチェックするアプリの効率的なテスト方法はありませんか？


以下のようにして、ページ読込時にinput要素に数値を設定するのはいかがでしょうか。

  * HTML
[code]     <table id="fields">

      <tr>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
      </tr>
      <tr>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
      </tr>
      <tr>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
        <td><input type="text" /></td>
      </tr>
    </table>
    
[/code]

  * JavaScript
[code]     //ページ読込完了時にshowValues()を実行する

    window.onload = function(){
       showValues();
    };
    
    
    //DOM操作により、各セルのinput要素に値を設定する
    function showValues(){
    
      var fields = document.getElementById("fields");
      var trs = fields.getElementsByTagName("tr");
    
      for(var i = 0; i < trs.length; i++){
        var tr = trs[i]
        var tds = tr.getElementsByTagName("td");
    
        for(var j = 0; j < tds.length; j++){
          var td = tds[j];
          var input = td.getElementsByTagName("input");
          input[0].value = getRandomValue();
        }
    
      }
    
    }
    
    
    //ランダムな数値を取得する
    function getRandomValue(){
        //1~100のランダムな整数を生成
        return Math.ceil(Math.random() * 100);
    }
    
[/code]


CC BY-SA 4.0
2018-10-15T13:49:37.063
49311
2018-10-15T13:49:37.063
30533
49237
answer


テストとして正しい手順を踏むなら`Selenium
WebDriver`というブラウザの操作を自動化できるものがありますので、jsを使うのでしたら`nodejs`でテストを書くことで実現できると思います。

ただ、そこまで難しいことをしなくても

[code]

    default_values = [[1,2,3],
                      [4,5,6],
                      [7,8,9]];
    
[/code]

のように2次元配列を作って、それぞれのinput要素を`default_values[0][0]`などを使い初期化すれば、一箇所を編集するだけでよいのでかなり楽になるのではないでしょうか。


CC BY-SA 4.0
2018-10-15T22:07:43.777
49319
2018-10-15T22:07:43.777
3271
49237
answer