Merge pull request #512 from mozilla/as/cc-hover-preview

Anca/ l10n demo - CC preview

Author: soncuteanca

SELECTOR_INFO.md

@@ -1368,6 +1368,13 @@ Location: Inside chrome context, holds the data that would be showed as a previe
 Path to .json: modules/data/autofill_popup.components.json
 ```
 ```
+Selector Name: cc-preview-form-container
+Selector Data: "credit-card-save-update-notification-content"
+Description: Form container that is hidden in chrome context. Used to verify hover preview data
+Location: Inside chrome context, holds the data that would be showed as a preview when autofill is hovered.
+Path to .json: modules/data/autofill_popup.components.json
+```
+```
 Selector Name: doorhanger-save-button
 Selector Data: button[label='Save'].popup-notification-primary-button
 Description: The "Save" button 

l10n_CM/Unified/test_demo_ad_hover_name_org.py

@@ -34,4 +34,6 @@ def test_demo_ad_hover_name_org(
     # Hover over each field and check data preview
     fields_to_test = ["name", "organization"]
     for field in fields_to_test:
-        address_autofill.check_autofill_preview_for_field(field, autofill_data, autofill_popup, util)
+        address_autofill.check_autofill_preview_for_field(
+            field, autofill_data, autofill_popup, util
+        )

l10n_CM/Unified/test_demo_ad_hover_over_tele_and_email_dropdown.py

@@ -26,6 +26,10 @@ def test_hover_email_and_phone_autofill_preview(
     autofill_popup.click_doorhanger_button("save")
 
     # Check Email field preview.
-    address_autofill.check_autofill_preview_for_field("email", autofill_data, autofill_popup, util)
+    address_autofill.check_autofill_preview_for_field(
+        "email", autofill_data, autofill_popup, util
+    )
     # Check Phone field preview (using the correct label "tel").
-    address_autofill.check_autofill_preview_for_field("tel", autofill_data, autofill_popup, util)
+    address_autofill.check_autofill_preview_for_field(
+        "tel", autofill_data, autofill_popup, util
+    )

l10n_CM/Unified/test_demo_cc_hover_verify_cc.py

@@ -0,0 +1,57 @@
+import pytest
+from selenium.webdriver import Firefox
+
+from modules.browser_object_autofill_popup import AutofillPopup
+from modules.page_object import AboutPrefs, CreditCardFill
+from modules.util import BrowserActions, Utilities
+
+
+@pytest.fixture()
+def test_case():
+    return "2886599"
+
+
+@pytest.fixture()
+def add_to_prefs_list(region: str):
+    return [("extensions.formautofill.creditCards.supportedCountries", region)]
+
+
+def test_cc_preview(
+    driver: Firefox,
+    util: Utilities,
+    about_prefs_privacy: AboutPrefs,
+    autofill_popup: AutofillPopup,
+    credit_card_fill_obj: CreditCardFill,
+):
+    """
+    C2886599 -  Verify that hovering over field will preview all eligible fields (except for the CVV field)
+    """
+
+    browser_action_obj = BrowserActions(driver)
+
+    # Save a credit card in about:preferences
+    about_prefs_privacy.open()
+    iframe = about_prefs_privacy.get_saved_payments_popup_iframe()
+    browser_action_obj.switch_to_iframe_context(iframe)
+
+    # Generate fake CC data & add it
+    credit_card_sample_data = util.fake_credit_card_data()
+    about_prefs_privacy.click_on(
+        "panel-popup-button", labels=["autofill-manage-add-button"]
+    )
+    about_prefs_privacy.fill_cc_panel_information(credit_card_sample_data)
+
+    # Open the credit card fill form
+    credit_card_fill_obj.open()
+
+    # Verify the autofill preview
+    for field in CreditCardFill.fields:
+        credit_card_fill_obj.click_on("form-field", labels=[field])
+        autofill_popup.ensure_autofill_dropdown_visible()
+        autofill_popup.hover("select-form-option")
+        credit_card_fill_obj.verify_autofill_cc_data_on_hover(
+            credit_card_sample_data, autofill_popup
+        )
+
+    credit_card_fill_obj.click_on("form-field", labels=["cc-csc"])
+    autofill_popup.ensure_autofill_dropdown_not_visible()

l10n_CM/region/Unified.json

@@ -25,6 +25,7 @@
     "test_demo_ad_autofill_dropdown_present_for_email_and_phone.py",
     "test_demo_ad_hover_verify_address.py",
     "test_demo_ad_hover_over_tele_and_email_dropdown.py",
-    "test_demo_ad_hover_name_org.py"
+    "test_demo_ad_hover_name_org.py",
+    "test_demo_cc_hover_verify_cc,"
   ]
 }

modules/data/autofill_popup.components.json

@@ -161,6 +161,12 @@
         "selectorData": "address-save-update-notification-content",
         "strategy": "class",
         "groups": []
+    },
+
+    "cc-preview-form-container": {
+        "selectorData": "credit-card-save-update-notification-content",
+        "strategy": "class",
+        "groups": []
     }
 }
 

modules/page_object_autofill.py

@@ -278,6 +278,35 @@ def update_credit_card_information(
         else:
             autofill_popup_obj.click_on("doorhanger-save-button")
 
+    @BasePage.context_chrome
+    def verify_autofill_cc_data_on_hover(
+        self,
+        autofill_data: CreditCardBase,
+        autofill_popup: AutofillPopup,
+    ):
+        """
+        Verifies that the credit card autofill preview data matches the expected values when hovering
+
+        Arguments:
+            autofill_data: CreditCardBase object containing expected credit card data.
+            autofill_popup: AutofillPopup object to get element from dropdown.
+        """
+        # Get preview data from hovering through the chrome context
+        element = autofill_popup.get_element("cc-preview-form-container")
+
+        # Get every span element that is a child of the form and is not empty
+        children = [
+            x.get_attribute("innerHTML")
+            for x in element.find_elements(By.TAG_NAME, "span")
+            if len(x.get_attribute("innerHTML").strip()) >= 2
+        ]
+
+        for expected in children:
+            # Check if this value exists in our CreditCardBase object
+            assert unescape(expected) in autofill_data.__dict__.values(), (
+                f"Mismatched data: {expected} not in {autofill_data}."
+            )
+
     @staticmethod
     def extract_credit_card_obj_into_list(
         credit_card_sample_data: CreditCardBase,
@@ -504,7 +533,14 @@ def verify_autofill_displayed(self):
             element = self.get_element("select-address")
             self.expect(EC.visibility_of(element))
 
-    def check_autofill_preview_for_field(self, field_label: str, autofill_data, autofill_popup, util: Utilities, region: str = None):
+    def check_autofill_preview_for_field(
+        self,
+        field_label: str,
+        autofill_data,
+        autofill_popup,
+        util: Utilities,
+        region: str = None,
+    ):
         # Skip fields that don't appear in the dropdown for certain regions.
         if field_label == "address-level1" and region in ["DE", "FR"]:
             return