Add FXIOS-9709 - Add a11y custom action to reader mode button (#21541)

* Add custom a11y action for reader mode * Rename a11y custom action name * Fix spelling --------- Co-authored-by: Winnie Teichmann <[email protected]>
mozilla-mobile · Aug 21, 2024 · 107055c · 107055c
1 parent 550f508
commit 107055c
Show file tree

Hide file tree

Showing 11 changed files with 111 additions and 35 deletions.
diff --git a/BrowserKit/Sources/ToolbarKit/ToolbarButton.swift b/BrowserKit/Sources/ToolbarKit/ToolbarButton.swift
@@ -42,6 +42,7 @@ class ToolbarButton: UIButton, ThemeApplicable {
         guard var config = configuration else { return }
         removeAllGestureRecognizers()
         configureLongPressGestureRecognizerIfNeeded(for: element)
+        configureCustomA11yActionIfNeeded(for: element)
         shouldDisplayAsHighlighted = element.shouldDisplayAsHighlighted
 
         let image = imageConfiguredForRTL(for: element)
@@ -132,6 +133,16 @@ class ToolbarButton: UIButton, ThemeApplicable {
         addGestureRecognizer(longPressRecognizer)
     }
 
+    private func configureCustomA11yActionIfNeeded(for element: ToolbarElement) {
+        guard let a11yCustomActionName = element.a11yCustomActionName,
+              let a11yCustomAction = element.a11yCustomAction else { return }
+        let a11yAction = UIAccessibilityCustomAction(name: a11yCustomActionName) { _ in
+            a11yCustomAction()
+            return true
+        }
+        accessibilityCustomActions = [a11yAction]
+    }
+
     private func imageConfiguredForRTL(for element: ToolbarElement) -> UIImage? {
         let image = UIImage(named: element.iconName)?.withRenderingMode(.alwaysTemplate)
         return element.isFlippedForRTL ? image?.imageFlippedForRightToLeftLayoutDirection() : image

diff --git a/BrowserKit/Sources/ToolbarKit/ToolbarElement.swift b/BrowserKit/Sources/ToolbarKit/ToolbarElement.swift
@@ -35,6 +35,12 @@ public struct ToolbarElement: Equatable {
     /// Accessibility identifier of the toolbar element
     let a11yId: String
 
+    /// Name for the custom accessibility action
+    let a11yCustomActionName: String?
+
+    /// Action to be performed for custom accessibility action
+    let a11yCustomAction: (() -> Void)?
+
     /// Closure that is executed when the toolbar element is tapped
     let onSelected: ((UIButton) -> Void)?
 
@@ -53,6 +59,8 @@ public struct ToolbarElement: Equatable {
                 a11yLabel: String,
                 a11yHint: String?,
                 a11yId: String,
+                a11yCustomActionName: String? = nil,
+                a11yCustomAction: (() -> Void)? = nil,
                 onSelected: ((UIButton) -> Void)?,
                 onLongPress: ((UIButton) -> Void)? = nil) {
         self.iconName = iconName
@@ -67,6 +75,8 @@ public struct ToolbarElement: Equatable {
         self.a11yLabel = a11yLabel
         self.a11yHint = a11yHint
         self.a11yId = a11yId
+        self.a11yCustomActionName = a11yCustomActionName
+        self.a11yCustomAction = a11yCustomAction
     }
 
     public static func == (lhs: ToolbarElement, rhs: ToolbarElement) -> Bool {

diff --git a/firefox-ios/Client/Frontend/Browser/BrowserViewController/Actions/GeneralBrowserAction.swift b/firefox-ios/Client/Frontend/Browser/BrowserViewController/Actions/GeneralBrowserAction.swift
@@ -51,6 +51,7 @@ enum GeneralBrowserActionType: ActionType {
     case showReaderMode
     case addNewTab
     case showNewTabLongPressActions
+    case addToReadingListLongPressAction
     case clearData
 }
 

diff --git a/...ntend/Browser/BrowserViewController/Extensions/BrowserViewController+URLBarDelegate.swift b/...ntend/Browser/BrowserViewController/Extensions/BrowserViewController+URLBarDelegate.swift
@@ -185,38 +185,7 @@ extension BrowserViewController: URLBarDelegate {
     }
 
     func urlBarDidLongPressReaderMode(_ urlBar: URLBarView) -> Bool {
-        guard let tab = tabManager.selectedTab,
-              let url = tab.url?.displayURL
-        else {
-            UIAccessibility.post(
-                notification: UIAccessibility.Notification.announcement,
-                argument: String.ReaderModeAddPageGeneralErrorAccessibilityLabel
-            )
-            return false
-        }
-
-        let result = profile.readingList.createRecordWithURL(
-            url.absoluteString,
-            title: tab.title ?? "",
-            addedBy: UIDevice.current.name
-        )
-
-        switch result.value {
-        case .success:
-            UIAccessibility.post(
-                notification: UIAccessibility.Notification.announcement,
-                argument: String.ReaderModeAddPageSuccessAcessibilityLabel
-            )
-            SimpleToast().showAlertWithText(.ShareAddToReadingListDone,
-                                            bottomContainer: contentContainer,
-                                            theme: currentTheme())
-        case .failure:
-            UIAccessibility.post(
-                notification: UIAccessibility.Notification.announcement,
-                argument: String.ReaderModeAddPageMaybeExistsErrorAccessibilityLabel
-            )
-        }
-        return true
+        toggleReaderModeLongPressAction()
     }
 
     func urlBarDidLongPressReload(_ urlBar: URLBarView, from button: UIButton) {

diff --git a/...-ios/Client/Frontend/Browser/BrowserViewController/State/BrowserViewControllerState.swift b/...-ios/Client/Frontend/Browser/BrowserViewController/State/BrowserViewControllerState.swift
@@ -29,6 +29,7 @@ struct BrowserViewControllerState: ScreenState, Equatable {
         case share
         case readerMode
         case newTabLongPressActions
+        case readerModeLongPressAction
         case dataClearance
     }
 
@@ -386,6 +387,16 @@ struct BrowserViewControllerState: ScreenState, Equatable {
                 browserViewType: state.browserViewType,
                 displayView: .newTabLongPressActions,
                 microsurveyState: MicrosurveyPromptState.reducer(state.microsurveyState, action))
+        case GeneralBrowserActionType.addToReadingListLongPressAction:
+            return BrowserViewControllerState(
+                searchScreenState: state.searchScreenState,
+                showDataClearanceFlow: state.showDataClearanceFlow,
+                fakespotState: state.fakespotState,
+                toast: state.toast,
+                windowUUID: state.windowUUID,
+                browserViewType: state.browserViewType,
+                displayView: .readerModeLongPressAction,
+                microsurveyState: MicrosurveyPromptState.reducer(state.microsurveyState, action))
         case GeneralBrowserActionType.clearData:
             return BrowserViewControllerState(
                 searchScreenState: state.searchScreenState,

diff --git a/firefox-ios/Client/Frontend/Browser/BrowserViewController/Views/BrowserViewController.swift b/firefox-ios/Client/Frontend/Browser/BrowserViewController/Views/BrowserViewController.swift
@@ -1960,6 +1960,8 @@ class BrowserViewController: UIViewController,
             didTapOnShare(from: button)
         case .readerMode:
             toggleReaderMode()
+        case .readerModeLongPressAction:
+            _ = toggleReaderModeLongPressAction()
         case .newTabLongPressActions:
             presentNewTabLongPressActionSheet(from: view)
         case .dataClearance:
@@ -2096,6 +2098,43 @@ class BrowserViewController: UIViewController,
         }
     }
 
+    func toggleReaderModeLongPressAction() -> Bool {
+        guard let tab = tabManager.selectedTab,
+              let url = tab.url?.displayURL
+        else {
+            UIAccessibility.post(
+                notification: UIAccessibility.Notification.announcement,
+                argument: String.ReaderModeAddPageGeneralErrorAccessibilityLabel
+            )
+
+            return false
+        }
+
+        let result = profile.readingList.createRecordWithURL(
+            url.absoluteString,
+            title: tab.title ?? "",
+            addedBy: UIDevice.current.name
+        )
+
+        switch result.value {
+        case .success:
+            UIAccessibility.post(
+                notification: UIAccessibility.Notification.announcement,
+                argument: String.ReaderModeAddPageSuccessAcessibilityLabel
+            )
+            SimpleToast().showAlertWithText(.ShareAddToReadingListDone,
+                                            bottomContainer: contentContainer,
+                                            theme: currentTheme())
+        case .failure:
+            UIAccessibility.post(
+                notification: UIAccessibility.Notification.announcement,
+                argument: String.ReaderModeAddPageMaybeExistsErrorAccessibilityLabel
+            )
+        }
+
+        return true
+    }
+
     private func showPhotonMainMenu(from button: UIButton?) {
         guard let button else { return }
 

diff --git a/firefox-ios/Client/Frontend/Browser/Toolbars/Models/AddressToolbarContainerModel.swift b/firefox-ios/Client/Frontend/Browser/Toolbars/Models/AddressToolbarContainerModel.swift
@@ -103,6 +103,13 @@ class AddressToolbarContainerModel: Equatable {
                 a11yLabel: action.a11yLabel,
                 a11yHint: action.a11yHint,
                 a11yId: action.a11yId,
+                a11yCustomActionName: action.a11yCustomActionName,
+                a11yCustomAction: action.a11yCustomActionName != nil ? {
+                    let action = ToolbarMiddlewareAction(buttonType: action.actionType,
+                                                         windowUUID: windowUUID,
+                                                         actionType: ToolbarMiddlewareActionType.customA11yAction)
+                    store.dispatch(action)
+                } : nil,
                 onSelected: { button in
                     let action = ToolbarMiddlewareAction(buttonType: action.actionType,
                                                          buttonTapped: button,

diff --git a/firefox-ios/Client/Frontend/Browser/Toolbars/Models/NavigationToolbarContainerModel.swift b/firefox-ios/Client/Frontend/Browser/Toolbars/Models/NavigationToolbarContainerModel.swift
@@ -28,6 +28,13 @@ struct NavigationToolbarContainerModel: Equatable {
                 a11yLabel: action.a11yLabel,
                 a11yHint: action.a11yHint,
                 a11yId: action.a11yId,
+                a11yCustomActionName: action.a11yCustomActionName,
+                a11yCustomAction: action.a11yCustomActionName != nil ? {
+                    let action = ToolbarMiddlewareAction(buttonType: action.actionType,
+                                                         windowUUID: windowUUID,
+                                                         actionType: ToolbarMiddlewareActionType.customA11yAction)
+                    store.dispatch(action)
+                } : nil,
                 onSelected: { button in
                     let action = ToolbarMiddlewareAction(buttonType: action.actionType,
                                                          buttonTapped: button,

diff --git a/firefox-ios/Client/Frontend/Browser/Toolbars/Redux/ToolbarAction.swift b/firefox-ios/Client/Frontend/Browser/Toolbars/Redux/ToolbarAction.swift
@@ -123,6 +123,7 @@ class ToolbarMiddlewareAction: Action {
 
 enum ToolbarMiddlewareActionType: ActionType {
     case didTapButton
+    case customA11yAction
     case numberOfTabsChanged
     case urlDidChange
     case searchEngineDidChange

diff --git a/firefox-ios/Client/Frontend/Browser/Toolbars/Redux/ToolbarActionState.swift b/firefox-ios/Client/Frontend/Browser/Toolbars/Redux/ToolbarActionState.swift
@@ -36,12 +36,14 @@ struct ToolbarActionState: Equatable, FeatureFlaggable {
     var a11yLabel: String
     var a11yHint: String?
     var a11yId: String
+    var a11yCustomActionName: String?
 
     func canPerformLongPressAction(isShowingTopTabs: Bool?) -> Bool {
         return actionType == .back ||
                actionType == .forward ||
                actionType == .reload ||
                actionType == .newTab ||
+               actionType == .readerMode ||
                (actionType == .tabs && isShowingTopTabs == false)
     }
 }
diff --git a/firefox-ios/Client/Frontend/Browser/Toolbars/Redux/ToolbarMiddleware.swift b/firefox-ios/Client/Frontend/Browser/Toolbars/Redux/ToolbarMiddleware.swift
@@ -47,7 +47,9 @@ final class ToolbarMiddleware: FeatureFlaggable {
         iconName: StandardImageIdentifiers.Large.readerView,
         isEnabled: true,
         a11yLabel: .TabLocationReaderModeAccessibilityLabel,
-        a11yId: AccessibilityIdentifiers.Toolbar.readerModeButton)
+        a11yHint: .TabLocationReloadAccessibilityHint,
+        a11yId: AccessibilityIdentifiers.Toolbar.readerModeButton,
+        a11yCustomActionName: .TabLocationReaderModeAddToReadingListAccessibilityLabel)
 
     lazy var qrCodeScanAction = ToolbarActionState(
         actionType: .qrCode,
@@ -130,6 +132,9 @@ final class ToolbarMiddleware: FeatureFlaggable {
 
     private func resolveToolbarMiddlewareActions(action: ToolbarMiddlewareAction, state: AppState) {
         switch action.actionType {
+        case ToolbarMiddlewareActionType.customA11yAction:
+            resolveToolbarMiddlewareCustomA11yActions(action: action, state: state)
+
         case ToolbarMiddlewareActionType.didTapButton:
             resolveToolbarMiddlewareButtonTapActions(action: action, state: state)
 
@@ -184,6 +189,16 @@ final class ToolbarMiddleware: FeatureFlaggable {
         }
     }
 
+    func resolveToolbarMiddlewareCustomA11yActions(action: ToolbarMiddlewareAction, state: AppState) {
+        switch action.buttonType {
+        case .readerMode:
+            let action = GeneralBrowserAction(windowUUID: action.windowUUID,
+                                              actionType: GeneralBrowserActionType.addToReadingListLongPressAction)
+            store.dispatch(action)
+        default: break
+        }
+    }
+
     private func loadInitialAddressToolbarState(toolbarPosition: AddressToolbarPosition) -> AddressToolbarModel {
         let borderPosition = getAddressBorderPosition(toolbarPosition: toolbarPosition)
 
@@ -307,8 +322,11 @@ final class ToolbarMiddleware: FeatureFlaggable {
             store.dispatch(action)
         case .newTab:
             let action = GeneralBrowserAction(windowUUID: action.windowUUID,
-                                              actionType: GeneralBrowserActionType.showNewTabLongPressActions
-            )
+                                              actionType: GeneralBrowserActionType.showNewTabLongPressActions)
+            store.dispatch(action)
+        case .readerMode:
+            let action = GeneralBrowserAction(windowUUID: action.windowUUID,
+                                              actionType: GeneralBrowserActionType.addToReadingListLongPressAction)
             store.dispatch(action)
         default:
             break