DON-384: Update SearchField sizes and accessibility for the Place Sel…

…ector GC (#1930) * DON-384: Adjust the TextField of the Place Selector GC [sizes update and accessibility] * DON-384: Adjust the TextField of the Place Selector GC [update UI tests] * Record screenshots * Record snapshots * Updated snapshots * Run CI build --------- Co-authored-by: Yura Reutskiy <[email protected]> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Skyscanner · Apr 5, 2024 · a0a2ed6 · a0a2ed6
1 parent c2e413a
commit a0a2ed6
Show file tree

Hide file tree

Showing 55 changed files with 14 additions and 3 deletions.
diff --git a/Backpack-SwiftUI/AppSearchModal/Classes/BPKAppSearchModal.swift b/Backpack-SwiftUI/AppSearchModal/Classes/BPKAppSearchModal.swift
@@ -53,7 +53,6 @@ public struct BPKAppSearchModal: View {
             if results.showTextField {
                 BPKSearchInputSummary(placeholder: inputHint, inputPrefix: inputPrefix, $inputText)
                     .inputState(textFieldState.inputState)
-                    .accessibilityAddTraits(.isSearchField)
                     .focused($inputFieldIsFocussed)
                     .autocorrectionDisabled(true)
             }
@@ -72,6 +71,7 @@ public struct BPKAppSearchModal: View {
         .padding(.top, .base)
         .padding(.bottom, BPKSpacing.none)
         .background(.surfaceDefaultColor)
+        .accessibilityAddTraits(.isModal)
     }
 
     func makeNavigationBar(

diff --git a/Backpack-SwiftUI/SearchInputSummary/Classes/BPKSearchInputSummary.swift b/Backpack-SwiftUI/SearchInputSummary/Classes/BPKSearchInputSummary.swift
@@ -63,9 +63,12 @@ public struct BPKSearchInputSummary: View {
                 .foregroundColor(state.textColor)
                 .disabled(state.isDisabled)
                 .focused($focused)
+                .accessibilityElement(children: .combine)
+                .accessibilityAddTraits(.isSearchField)
             accessory
         }
-        .padding(.md)
+        .frame(maxWidth: .infinity, minHeight: 48.0)
+        .padding(.horizontal, BPKSpacing.base)
         .background(.surfaceDefaultColor)
         .clipShape(RoundedRectangle(cornerRadius: .sm))
         .outline(focused ? .textLinkColor : state.borderColor, cornerRadius: .sm, lineWidth: focused ? 2.0 : 1.0)
@@ -79,7 +82,9 @@ public struct BPKSearchInputSummary: View {
                     BPKIconView(icon.icon)
                         .foregroundColor(icon.color)
                 }
-                    .accessibilityLabel(accessibilityLabel)
+                .accessibilityElement(children: .ignore)
+                .accessibilityLabel(accessibilityLabel)
+                .accessibilityAddTraits(.isButton)
             } else {
                 BPKIconView(icon.icon)
                     .foregroundColor(icon.color)

diff --git a/...SearchModal/__Snapshots__/BPKAppSearchModalTests/test_withContent.dark-mode.png b/...SearchModal/__Snapshots__/BPKAppSearchModalTests/test_withContent.dark-mode.png
diff --git a/...earchModal/__Snapshots__/BPKAppSearchModalTests/test_withContent.light-mode.png b/...earchModal/__Snapshots__/BPKAppSearchModalTests/test_withContent.light-mode.png
diff --git a/...ts/AppSearchModal/__Snapshots__/BPKAppSearchModalTests/test_withContent.rtl.png b/...ts/AppSearchModal/__Snapshots__/BPKAppSearchModalTests/test_withContent.rtl.png
diff --git a/...napshots__/BPKAppSearchModalTests/test_withContentInputStateClear.dark-mode.png b/...napshots__/BPKAppSearchModalTests/test_withContentInputStateClear.dark-mode.png
diff --git a/...apshots__/BPKAppSearchModalTests/test_withContentInputStateClear.light-mode.png b/...apshots__/BPKAppSearchModalTests/test_withContentInputStateClear.light-mode.png
diff --git a/...al/__Snapshots__/BPKAppSearchModalTests/test_withContentInputStateClear.rtl.png b/...al/__Snapshots__/BPKAppSearchModalTests/test_withContentInputStateClear.rtl.png
diff --git a/...s__/BPKAppSearchModalTests/test_withContentWhenPrefixIsCustomText.dark-mode.png b/...s__/BPKAppSearchModalTests/test_withContentWhenPrefixIsCustomText.dark-mode.png
diff --git a/...__/BPKAppSearchModalTests/test_withContentWhenPrefixIsCustomText.light-mode.png b/...__/BPKAppSearchModalTests/test_withContentWhenPrefixIsCustomText.light-mode.png
diff --git a/...apshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsCustomText.rtl.png b/...apshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsCustomText.rtl.png
diff --git a/...apshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsIcon.dark-mode.png b/...apshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsIcon.dark-mode.png
diff --git a/...pshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsIcon.light-mode.png b/...pshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsIcon.light-mode.png
diff --git a/...l/__Snapshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsIcon.rtl.png b/...l/__Snapshots__/BPKAppSearchModalTests/test_withContentWhenPrefixIsIcon.rtl.png
diff --git a/...SearchModal/__Snapshots__/BPKAppSearchModalTests/test_withLoading.dark-mode.png b/...SearchModal/__Snapshots__/BPKAppSearchModalTests/test_withLoading.dark-mode.png
diff --git a/...earchModal/__Snapshots__/BPKAppSearchModalTests/test_withLoading.light-mode.png b/...earchModal/__Snapshots__/BPKAppSearchModalTests/test_withLoading.light-mode.png
diff --git a/...ts/AppSearchModal/__Snapshots__/BPKAppSearchModalTests/test_withLoading.rtl.png b/...ts/AppSearchModal/__Snapshots__/BPKAppSearchModalTests/test_withLoading.rtl.png
diff --git a/Backpack-SwiftUI/Tests/SearchInputSummary/BPKSearchInputSummaryTests.swift b/Backpack-SwiftUI/Tests/SearchInputSummary/BPKSearchInputSummaryTests.swift
@@ -100,4 +100,10 @@ class BPKSearchInputSummaryTests: XCTestCase {
                 .inputState(.error)
                 .frame(width: 300))
     }
+
+    func test_accessibility() {
+        let searchInput = BPKSearchInputSummary(inputPrefix: .icon(.search), .constant("Value"))
+            .frame(width: 300)
+        assertA11ySnapshot(searchInput)
+    }
 }
diff --git a/...putSummary/__Snapshots__/BPKSearchInputSummaryTests/test_accessibility.a11y.png b/...putSummary/__Snapshots__/BPKSearchInputSummaryTests/test_accessibility.a11y.png
diff --git a/...KSearchInputSummaryTests/test_clearableField_withCustomPrefixText.dark-mode.png b/...KSearchInputSummaryTests/test_clearableField_withCustomPrefixText.dark-mode.png
diff --git a/...SearchInputSummaryTests/test_clearableField_withCustomPrefixText.light-mode.png b/...SearchInputSummaryTests/test_clearableField_withCustomPrefixText.light-mode.png
diff --git a/...s__/BPKSearchInputSummaryTests/test_clearableField_withCustomPrefixText.rtl.png b/...s__/BPKSearchInputSummaryTests/test_clearableField_withCustomPrefixText.rtl.png
diff --git a/...s__/BPKSearchInputSummaryTests/test_clearableField_withPrefixIcon.dark-mode.png b/...s__/BPKSearchInputSummaryTests/test_clearableField_withPrefixIcon.dark-mode.png
diff --git a/...__/BPKSearchInputSummaryTests/test_clearableField_withPrefixIcon.light-mode.png b/...__/BPKSearchInputSummaryTests/test_clearableField_withPrefixIcon.light-mode.png
diff --git a/...apshots__/BPKSearchInputSummaryTests/test_clearableField_withPrefixIcon.rtl.png b/...apshots__/BPKSearchInputSummaryTests/test_clearableField_withPrefixIcon.rtl.png
diff --git a/...SearchInputSummaryTests/test_defaultSettings_withCustomPrefixText.dark-mode.png b/...SearchInputSummaryTests/test_defaultSettings_withCustomPrefixText.dark-mode.png
diff --git a/...earchInputSummaryTests/test_defaultSettings_withCustomPrefixText.light-mode.png b/...earchInputSummaryTests/test_defaultSettings_withCustomPrefixText.light-mode.png
diff --git a/...__/BPKSearchInputSummaryTests/test_defaultSettings_withCustomPrefixText.rtl.png b/...__/BPKSearchInputSummaryTests/test_defaultSettings_withCustomPrefixText.rtl.png
diff --git a/...__/BPKSearchInputSummaryTests/test_defaultSettings_withPrefixIcon.dark-mode.png b/...__/BPKSearchInputSummaryTests/test_defaultSettings_withPrefixIcon.dark-mode.png
diff --git a/..._/BPKSearchInputSummaryTests/test_defaultSettings_withPrefixIcon.light-mode.png b/..._/BPKSearchInputSummaryTests/test_defaultSettings_withPrefixIcon.light-mode.png
diff --git a/...pshots__/BPKSearchInputSummaryTests/test_defaultSettings_withPrefixIcon.rtl.png b/...pshots__/BPKSearchInputSummaryTests/test_defaultSettings_withPrefixIcon.rtl.png
diff --git a/...PKSearchInputSummaryTests/test_disabledField_withCustomPrefixText.dark-mode.png b/...PKSearchInputSummaryTests/test_disabledField_withCustomPrefixText.dark-mode.png
diff --git a/...KSearchInputSummaryTests/test_disabledField_withCustomPrefixText.light-mode.png b/...KSearchInputSummaryTests/test_disabledField_withCustomPrefixText.light-mode.png
diff --git a/...ts__/BPKSearchInputSummaryTests/test_disabledField_withCustomPrefixText.rtl.png b/...ts__/BPKSearchInputSummaryTests/test_disabledField_withCustomPrefixText.rtl.png
diff --git a/...ts__/BPKSearchInputSummaryTests/test_disabledField_withPrefixIcon.dark-mode.png b/...ts__/BPKSearchInputSummaryTests/test_disabledField_withPrefixIcon.dark-mode.png
diff --git a/...s__/BPKSearchInputSummaryTests/test_disabledField_withPrefixIcon.light-mode.png b/...s__/BPKSearchInputSummaryTests/test_disabledField_withPrefixIcon.light-mode.png
diff --git a/...napshots__/BPKSearchInputSummaryTests/test_disabledField_withPrefixIcon.rtl.png b/...napshots__/BPKSearchInputSummaryTests/test_disabledField_withPrefixIcon.rtl.png
diff --git a/..._/BPKSearchInputSummaryTests/test_emptyField_withCustomPrefixText.dark-mode.png b/..._/BPKSearchInputSummaryTests/test_emptyField_withCustomPrefixText.dark-mode.png
diff --git a/.../BPKSearchInputSummaryTests/test_emptyField_withCustomPrefixText.light-mode.png b/.../BPKSearchInputSummaryTests/test_emptyField_withCustomPrefixText.light-mode.png
diff --git a/...shots__/BPKSearchInputSummaryTests/test_emptyField_withCustomPrefixText.rtl.png b/...shots__/BPKSearchInputSummaryTests/test_emptyField_withCustomPrefixText.rtl.png
diff --git a/...shots__/BPKSearchInputSummaryTests/test_emptyField_withPrefixIcon.dark-mode.png b/...shots__/BPKSearchInputSummaryTests/test_emptyField_withPrefixIcon.dark-mode.png
diff --git a/...hots__/BPKSearchInputSummaryTests/test_emptyField_withPrefixIcon.light-mode.png b/...hots__/BPKSearchInputSummaryTests/test_emptyField_withPrefixIcon.light-mode.png
diff --git a/...__Snapshots__/BPKSearchInputSummaryTests/test_emptyField_withPrefixIcon.rtl.png b/...__Snapshots__/BPKSearchInputSummaryTests/test_emptyField_withPrefixIcon.rtl.png
diff --git a/..._/BPKSearchInputSummaryTests/test_errorField_withCustomPrefixText.dark-mode.png b/..._/BPKSearchInputSummaryTests/test_errorField_withCustomPrefixText.dark-mode.png
diff --git a/.../BPKSearchInputSummaryTests/test_errorField_withCustomPrefixText.light-mode.png b/.../BPKSearchInputSummaryTests/test_errorField_withCustomPrefixText.light-mode.png
diff --git a/...shots__/BPKSearchInputSummaryTests/test_errorField_withCustomPrefixText.rtl.png b/...shots__/BPKSearchInputSummaryTests/test_errorField_withCustomPrefixText.rtl.png
diff --git a/...shots__/BPKSearchInputSummaryTests/test_errorField_withPrefixIcon.dark-mode.png b/...shots__/BPKSearchInputSummaryTests/test_errorField_withPrefixIcon.dark-mode.png
diff --git a/...hots__/BPKSearchInputSummaryTests/test_errorField_withPrefixIcon.light-mode.png b/...hots__/BPKSearchInputSummaryTests/test_errorField_withPrefixIcon.light-mode.png
diff --git a/...__Snapshots__/BPKSearchInputSummaryTests/test_errorField_withPrefixIcon.rtl.png b/...__Snapshots__/BPKSearchInputSummaryTests/test_errorField_withPrefixIcon.rtl.png
diff --git a/..._/BPKSearchInputSummaryTests/test_validField_withCustomPrefixText.dark-mode.png b/..._/BPKSearchInputSummaryTests/test_validField_withCustomPrefixText.dark-mode.png
diff --git a/.../BPKSearchInputSummaryTests/test_validField_withCustomPrefixText.light-mode.png b/.../BPKSearchInputSummaryTests/test_validField_withCustomPrefixText.light-mode.png
diff --git a/...shots__/BPKSearchInputSummaryTests/test_validField_withCustomPrefixText.rtl.png b/...shots__/BPKSearchInputSummaryTests/test_validField_withCustomPrefixText.rtl.png
diff --git a/...shots__/BPKSearchInputSummaryTests/test_validField_withPrefixIcon.dark-mode.png b/...shots__/BPKSearchInputSummaryTests/test_validField_withPrefixIcon.dark-mode.png
diff --git a/...hots__/BPKSearchInputSummaryTests/test_validField_withPrefixIcon.light-mode.png b/...hots__/BPKSearchInputSummaryTests/test_validField_withPrefixIcon.light-mode.png
diff --git a/...__Snapshots__/BPKSearchInputSummaryTests/test_validField_withPrefixIcon.rtl.png b/...__Snapshots__/BPKSearchInputSummaryTests/test_validField_withPrefixIcon.rtl.png