VBSでのIE操作（AngularJSのページ）でプルダウン選択が効かない

###前提・実現したいこと
VBSでIE（11)を操作してスクレイピングするシステムを作っています。

IEで操作したいwebページが、Javascriptのフレームワークである
Angular(1.2)を利用したページでうまく動かない箇所がある為、解決策について相談させて下さい。

宜しくお願いいたします。

■スクレイピングしたいページ
プルダウンを選択して、ボタンを押すと
プルダウンで選択した値がメッセージとして表示されるページです。
（実際のページを見せるわけにはいかないので、簡易的なページで再現しています）

■サンプル
http://153.121.53.155/q/angular_test.html

###発生している問題・エラーメッセージ

VBSのIE操作で、プルダウンを選択してもメッセージに反映されず
「undefinedを選択しました」と表示されてしまいます。

VBSでプルダウン選択・ボタンクリックはできているので
おそらくAngularの動きに原因があるのではと考えています。

VBSで操作したときのIEの挙動（動画）：
http://153.121.53.155/q/2017-03-17_1655.swf

###該当のソースコード

vbscript
1<?xml version="1.0" encoding="utf-8" ?>
2<package>
3  <job>
4    <runtime></runtime>
5    <script language="VBScript">
6    <![CDATA[
7		Sub IEClose()
8			'IEを閉じる
9			Dim objProcess
10			Dim objProcList
11			Dim strProcName
12
13			strProcName = "iexplore.exe"
14
15			Set objProcList = GetObject("winmgmts:").InstancesOf("win32_process")
16			For Each objProcess In objProcList
17			    If LCase(objProcess.Name) = strProcName Then
18			        objProcess.Terminate
19			        Exit For
20			    End If
21			Next
22			Set objProcList = Nothing
23		End Sub
24
25		Sub waitPage(objIE)
26			'IEブラウザが開くまで待つ
27			WScript.sleep (300)
28			Do While objIE.busy
29			Loop
30			Do While objIE.Document.readyState <> "complete"
31			Loop
32		End Sub
33
34
35		Sub getPage(objIE, strURL)
36			'ページを取得する関数
37			objIE.Navigate (strURL)
38			Call waitPage(objIE)
39		End Sub
40		
41        set objIE = WScript.CreateObject("InternetExplorer.Application")
42		objIE.Visible = True
43		
44        Call getPage(objIE, "http://153.121.53.155/q/angular_test.html")
45        Call waitPage(objIE)
46        
47        Set money_select  = objIE.Document.getElementsByTagName("SELECT")(0)
48        money_select.selectedIndex = 2
49        money_select.fireEvent("onchange")
50        
51        Call waitPage(objIE)
52        
53        Set objBtn = objIE.Document.getElementsByTagName("button")
54        objBtn(0).click
55        
56        Call waitPage(objIE)
57    ]]>
58    </script>
59  </job>
60</package>

###試したこと

・だめもとで、プルダウンのoption要素に対しても、fireEventをつけてみたのですが挙動は変わらずでした。

vbscript
1Set money_option  = objIE.Document.getElementsByTagName("OPTION")(2)
2money_option.fireEvent("onchange")

###補足情報(言語/FW/ツール等のバージョンなど)

VBS
・IE11を操作

スクレイピング先ページライブラリ
・AngularJS v1.2.26

行動規範の内容に同意します

回答1件

ちょっと正確にはわからないのですが、ng-modelの発火イベントがスクリプト起動だと発生していないのかもしれませんね。
VBScriptの動作環境がないので東方で確認できないのですが、ng-optionsという機能がありますので利用してみては如何でしょうか。

HTML
1
2<!DOCTYPE html>
3<html ng-app="myApp">
4<head>
5<meta charset="UTF-8"/>
6<title>AngularJS テスト</title>
7</head>
8<body>
9<form ng-controller="myController">
10  <label for="name">金額：</label>
11  <select id="name" name="name" ng-model="name" ng-options="name for name in names">
12  </select>
13  <button ng-click="onclick()">送信</button>
14  <div>{{msg}}</div>
15</form>
16<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
17<script>
18	angular.module('myApp',[]).controller(
19		'myController',
20		[
21			'$scope',
22			function($scope){
23				$scope.names=[1000,2000,3000]
24				$scope.msg='金額を選択して下さい';
25				$scope.onclick=function(){
26					$scope.msg=$scope.name+'を選択しました';
27				};
28			}
29		]
30	);
31</script>
32</body>
33</html>

もしくはonclickの最初に$scope.apply();を実行してはどうでしょうか。

投稿2017/03/22 01:58

akabee

総合スコア1947

退会済みユーザー

2017/03/22 07:45

ご回答いただきありがとうございます。いただいたアドバイスをもとに試してみたのですが解決には至りませんでした。 >ng-optionsという機能がありますので利用してみては如何でしょうか。私の説明が悪く申し訳ないのですが、スクレイピングしたいページ（Angular利用）はこちらから編集する事ができないページの為、この対応は出来なさそうです。 >onclickの最初に$scope.apply();を実行してはどうでしょうか。 VBSでJavascriptを実行するPGMで、アドバイスいただいたやり方を試してみましたが挙動に変化はなく、ダメでした。 ※ボタンを押す前に、「$scope.$apply();」を実行してみました。　 ------------- objIE.Document.Script.setTimeout "javascript:$scope.$apply();", 1000 Set objBtn = objIE.Document.getElementsByTagName("button") objBtn(0).click ------------- 参考にしたサイト： http://d.hatena.ne.jp/ken3memo/20110626/1309072974

akabee

2017/03/22 11:16

スクレイピング対象のページは変更できないのですね。そうするとこの問題が解決可能かどうかの結論を得るためにはAngularJSに対する非常に深い知識が必要になってくると思われるのですが、私にはそこまでの知識がなく力になれそうにありません。具体的にはAngularJSはどのようにページの変更イベントを受け取り$scopeを随時更新しているのか、そしてそれはVBScriptから動かしたときにどのように動作するのかということが説明できなければなりません。私の知識は乏しいのですが、できるだけAngularJSネイティブな書き方でプルダウンを記述したほうが良いと思いng-optionsを薦めました。むしろ私には元のページのselectタブ内のoptionsの値がどのようにng-modelのnameにバインドされているかのほうがよく分かりません。 $scope.$apply()はjavascript内で変更された値が見た目上変わらない場合に使います。サードパーティ製プラグイン等（つまりAngularJSのスコープ外）で$scope内のプロパティの値が変更された場合など、Controller側で値が変更されたことが分からず、画面上の値にバインドが行われないために手動でバインドするというのがこのコードの意図です。実はAngularJS内部では至るところでこの挙動が行われているようです。今回VBScriptから$scope.$apply()を実行したとのことですが、この場合の$scopeはどこを指しているのでしょうね。意図するような挙動が行われたのかどうかも分かりませんし、元のコードに$scope.$apply()を付与できれば解決するのかどうかも私では判断できません。お力になれず申し訳ありません。

行動規範の内容に同意します