はwebdriverIO

Question

で

をトグルスイッチをクリックしてどのようにHTML要素が <div class="toggleButton" ng-class="{checked: settings.$storage.enabledApps[app.name]}" ng-click="settings.apps.toggleApp(app.name)"><input class="workplayEnabled switch" type="checkbox" ng-checked="settings.$storage.enabledApps[app.name]"></div>

のように見える私はbrowser.click('.toggleButton .switch'),browser.click('.toggleButton'), browser.click(' .switch')

をしようとしたが、私がbrowser.isSelected('.toggleButton .switch'),browser.isSelected('.toggleButton'), browser.isSelected(' .switch')をしようとした場合、それはfalseを返すのに対し、それは 要素は見えないように、エラーがスローされます 働いていません

Answer 1

複数のことを間違えているため、正確にピンポイントすることは難しいです。EXACT問題は間違っています。

HTMLの内訳：

• AngularJSを経由して生成されたHTMLです。
• あなたが気づく角度の属性（ng -attributes /ディレクティブ）を分析した場合にのみ、あなたの<div>機能は、このようにあなただけ<div>要素をターゲットにする必要があり、（ng-click="settings.apps.toggleApp(app.name)"経由）追加・トリガ]をクリックしています。
• <input>は反応的な動作のみを持ちます（トグルボタンがチェックされている場合は、ng-checkedトリガに値が設定されます）。

あなたの問題：は今、私たちはあなたの<div>をクリックして溶液を絞り込むこと、我々はあなたの選択が正しいの要素を返していることを確認する必要があります。

• 、あなたの角度アプリを開きます（例えば：$(div.toggleButton)）あなたのセレクタが動作しているか見てみてくださいブラウザのコンソール&を開きます。 CSSセレクタが要素（$(div.toggleButton).length > 1）以上を返した場合、それはそのクラスに複数の<div>があることを意味します。より具体的なロケータを見つけなければなりません。

• あなた<div>の正しいロケータを発見した後、私は簡単にシナリオをデバッグすることができるように、私はあなたのWebdriverIOスクリプトで前にあなたのクリックに.debug()（詳細here）を追加することになりますが。

• デバッグモードで1回実行すると、ブラウザのコンソールで自分の要素を見つけた同じセレクタを試してみます。

!!!注：ng-checkedの条件を満たしているトグルスイッチをクリックできなかったとお伝えした通り、.isSelected()は常にシナリオでfalseを返します。これを確認するには、デバッグモードでトグルスイッチを手動で選択し、<input>で.isSelected()コマンドを実行します。その後、trueを返します。