feat: surface editor crashes natively and offer a reload

android/Gutenberg/build.gradle.kts

@@ -86,8 +86,9 @@ android {
     testOptions {
         unitTests {
             isReturnDefaultValues = true
-            // Views the editor shows natively, such as the block inserter, read
-            // their resources, so Robolectric needs the merged resources.
+            // Views the editor shows natively, such as the block inserter and its
+            // error states, read their resources, so Robolectric needs the merged
+            // resources.
             isIncludeAndroidResources = true
             all {
                 // Make the shared test fixtures available to fixture-driven tests.

android/Gutenberg/src/main/java/org/wordpress/gutenberg/GutenbergView.kt

@@ -99,6 +99,16 @@ class GutenbergView : FrameLayout {
     private val webView: WebView
     @Volatile private var isEditorLoaded = false
     private var didFireEditorLoaded = false
+
+    /**
+     * Whether opening the editor has already placed the caret in its content.
+     *
+     * Unlike [didFireEditorLoaded], this survives a reload. Autofocus decides
+     * from the content the editor was opened with, which a reload can replace
+     * with newer content from the host, so repeating it would pop the keyboard
+     * over a restored post.
+     */
+    private var hasAutofocused = false
     private lateinit var assetLoader: WebViewAssetLoader
     private lateinit var assetAuthority: String
     private val configuration: EditorConfiguration
@@ -214,6 +224,7 @@ class GutenbergView : FrameLayout {
     var textEditorEnabled: Boolean = false
         set(value) {
             field = value
+            if (!isEditorLoaded) return
             val mode = if (value) "text" else "visual"
             handler.post {
                 webView.evaluateJavascript("editor.switchEditorMode('$mode');", null)
@@ -363,6 +374,7 @@ class GutenbergView : FrameLayout {
             spinnerView.animate().alpha(1f).setDuration(200).start()
             errorView.visibility = GONE
             webView.alpha = 0f
+            webView.visibility = VISIBLE
         }
     }
 
@@ -378,6 +390,7 @@ class GutenbergView : FrameLayout {
                 progressView.visibility = GONE
             }.start()
             errorView.visibility = GONE
+            webView.visibility = VISIBLE
             webView.animate().alpha(1f).setDuration(200).start()
         }
     }
@@ -386,18 +399,29 @@ class GutenbergView : FrameLayout {
      * Transitions to the error phase (loading failed).
      */
     private fun showErrorPhase(error: Throwable) {
+        showErrorView { setError(error) }
+    }
+
+    /**
+     * Replaces the editor and any loading indicator with [errorView], after
+     * [configure] sets its content.
+     */
+    private fun showErrorView(configure: EditorErrorView.() -> Unit) {
         handler.post {
             progressView.animate().alpha(0f).setDuration(200).withEndAction {
                 progressView.visibility = GONE
             }.start()
             spinnerView.animate().alpha(0f).setDuration(200).withEndAction {
                 spinnerView.visibility = GONE
             }.start()
-            errorView.setError(error)
+            errorView.configure()
             errorView.alpha = 0f
             errorView.visibility = VISIBLE
             errorView.animate().alpha(1f).setDuration(200).start()
             webView.alpha = 0f
+            // Transparency alone leaves the web view reachable by touch and TalkBack.
+            webView.visibility = INVISIBLE
+            errorView.focusTitleForAccessibility()
         }
     }
 
@@ -667,6 +691,10 @@ class GutenbergView : FrameLayout {
      * background-thread delegate assignment.
      */
     private fun onEditorPageStarted() {
+        // Readiness belongs to the page: a new page, including one a reload starts,
+        // is not ready until it reports `onEditorLoaded`.
+        isEditorLoaded = false
+        didFireEditorLoaded = false
         if (!hasStartedLoading) {
             hasStartedLoading = true
             startUploadServer()
@@ -829,9 +857,11 @@ class GutenbergView : FrameLayout {
      * `editor` API, so calls to them are refused from this point until the editor
      * reloads.
      *
-     * The editor cannot recover on its own. Hosts should disable the controls that
-     * depend on it — history, editor mode — while leaving those that read from
-     * their own persisted copy, such as saving and closing, available.
+     * GutenbergKit covers the editor with a notice offering to reload it. Until it
+     * reloads, hosts should disable the controls that depend on the editor —
+     * history, editor mode — while leaving those that read from their own
+     * persisted copy, such as saving and closing, available. Re-enable them the
+     * next time [EditorAvailableListener.onEditorAvailable] is called.
      */
     fun interface EditorUnavailableListener {
         fun onEditorUnavailable(view: GutenbergView?)
@@ -855,16 +885,17 @@ class GutenbergView : FrameLayout {
     }
 
     /**
-     * Provides the latest persisted content for recovery after WebView refresh.
+     * Provides the content the editor starts from when its page loads.
      *
-     * When the WebView reinitializes (e.g., due to OS memory pressure or page refresh),
-     * the editor requests the latest content from this provider. The host app should
-     * return the most recently persisted title and content from autosave.
+     * Asked each time the editor page loads, including when it reloads after a
+     * crash. Return the newest title and content the host holds, including
+     * anything saved during this session.
      */
     interface LatestContentProvider {
         /**
-         * Returns the most recently persisted title and content from autosave.
-         * @return LatestContent if available, null if no persisted content exists.
+         * Returns the newest title and content the host holds.
+         * @return LatestContent, or null to start from the content the editor was
+         * opened with, discarding any edits made since.
          */
         fun getLatestContent(): LatestContent?
     }
@@ -938,15 +969,27 @@ class GutenbergView : FrameLayout {
         Log.i("GutenbergView", "EditorLoaded received in native code")
         isEditorLoaded = true
         handler.post {
+            // The editor can become unavailable before this runs, which resets
+            // readiness and shows the crash notice. Carrying on would report the
+            // editor available again and replace that notice with the ready phase.
+            if (!isEditorLoaded) return@post
+
             lastKnownConnectivity?.let { isConnected ->
                 if (!isConnected) dispatchConnectivityEvent(false)
             }
             if(!didFireEditorLoaded) {
+                // The web editor always starts in visual mode, so restore code
+                // editor mode when the host enabled it, including after a reload.
+                if (textEditorEnabled) {
+                    webView.evaluateJavascript("editor.switchEditorMode('text');", null)
+                }
                 editorDidBecomeAvailableListener?.onEditorAvailable(this)
                 this.didFireEditorLoaded = true
                 showReadyPhase()
 
-                if (configuration.content.isEmpty()) {
+                if (!hasAutofocused && configuration.content.isEmpty()) {
+                    hasAutofocused = true
+
                     // Focus the editor content
                     webView.evaluateJavascript("editor.focus();", null)
 
@@ -973,13 +1016,50 @@ class GutenbergView : FrameLayout {
     fun onEditorUnavailable() {
         Log.e("GutenbergView", "EditorUnavailable received in native code")
         isEditorLoaded = false
+        showEditorCrashPhase()
         handler.post {
             // Picks made in an open inserter can no longer reach the editor.
             blockInserterDialog?.dismiss()
             editorDidBecomeUnavailableListener?.onEditorUnavailable(this)
         }
     }
 
+    /**
+     * Covers the editor with a notice offering to reload.
+     *
+     * The web view still shows the editor's error message underneath, so it is
+     * covered rather than left showing two competing error states.
+     */
+    private fun showEditorCrashPhase() {
+        showErrorView {
+            setActionableState(
+                titleResId = R.string.gbk_editor_crashed_title,
+                descriptionResId = R.string.gbk_editor_crashed_description,
+                actionResId = R.string.gbk_editor_crashed_reload,
+                onAction = { reloadEditor() }
+            )
+        }
+    }
+
+    /**
+     * Reloads the editor after it has crashed.
+     *
+     * The reloaded editor starts from the content [LatestContentProvider]
+     * returns, or from the content it was opened with when there is none.
+     * Readiness is reset immediately and restored only once the editor emits
+     * `onEditorLoaded` again.
+     */
+    internal fun reloadEditor() {
+        isEditorLoaded = false
+        // The reload replaces the page these reads were sent to, so their results
+        // may never arrive.
+        failPendingTitleAndContentReads()
+        handler.post {
+            showSpinnerPhase()
+            webView.reload()
+        }
+    }
+
     @JavascriptInterface
     fun onEditorContentChanged() {
         contentChangeListener?.onContentChanged()

android/Gutenberg/src/main/java/org/wordpress/gutenberg/views/EditorErrorView.kt

@@ -2,11 +2,18 @@ package org.wordpress.gutenberg.views
 
 import android.content.Context
 import android.util.AttributeSet
+import android.util.TypedValue
 import android.view.Gravity
+import android.view.accessibility.AccessibilityNodeInfo
+import android.widget.Button
 import android.widget.ImageView
 import android.widget.LinearLayout
 import android.widget.TextView
+import androidx.annotation.StringRes
+import androidx.core.view.ViewCompat
 import androidx.core.widget.TextViewCompat
+import com.google.android.material.button.MaterialButton
+import org.wordpress.gutenberg.R
 
 /**
  * A view displaying an error state with an icon, title, and description.
@@ -30,6 +37,7 @@ class EditorErrorView @JvmOverloads constructor(
     private val icon: ImageView
     private val titleText: TextView
     private val descriptionText: TextView
+    private val actionButton: Button
 
     init {
         orientation = VERTICAL
@@ -38,7 +46,7 @@ class EditorErrorView @JvmOverloads constructor(
         // Create error icon
         icon = ImageView(context).apply {
             layoutParams = LayoutParams(dpToPx(48), dpToPx(48))
-            setImageResource(android.R.drawable.ic_dialog_alert)
+            setImageResource(R.drawable.gbk_ic_editor_error)
         }
 
         // Create title
@@ -50,7 +58,8 @@ class EditorErrorView @JvmOverloads constructor(
             }
             gravity = Gravity.CENTER
             TextViewCompat.setTextAppearance(this, android.R.style.TextAppearance_Material_Subhead)
-            text = "Failed to load editor"
+            text = context.getText(R.string.gbk_editor_load_failed_title)
+            ViewCompat.setAccessibilityHeading(this, true)
         }
 
         // Create description
@@ -64,9 +73,18 @@ class EditorErrorView @JvmOverloads constructor(
             TextViewCompat.setTextAppearance(this, android.R.style.TextAppearance_Material_Body1)
         }
 
+        // Hidden unless the state gives the user something to do about it.
+        actionButton = createActionButton().apply {
+            layoutParams = LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT).apply {
+                topMargin = dpToPx(16)
+            }
+            visibility = GONE
+        }
+
         addView(icon)
         addView(titleText)
         addView(descriptionText)
+        addView(actionButton)
     }
 
     /**
@@ -75,7 +93,67 @@ class EditorErrorView @JvmOverloads constructor(
      * @param error The exception that caused the failure.
      */
     fun setError(error: Throwable) {
-        descriptionText.text = error.message ?: "Unknown error"
+        setTitle(context.getText(R.string.gbk_editor_load_failed_title))
+        descriptionText.text =
+            error.message ?: context.getString(R.string.gbk_editor_load_failed_unknown_error)
+        clearAction()
+    }
+
+    /**
+     * Shows a state the user can act on, rather than a load failure.
+     *
+     * @param titleResId Title describing the state.
+     * @param descriptionResId What the user can do about it.
+     * @param actionResId Label for the action button.
+     * @param onAction Invoked when the action button is tapped.
+     */
+    fun setActionableState(
+        @StringRes titleResId: Int,
+        @StringRes descriptionResId: Int,
+        @StringRes actionResId: Int,
+        onAction: () -> Unit
+    ) {
+        setTitle(context.getText(titleResId))
+        descriptionText.setText(descriptionResId)
+        actionButton.setText(actionResId)
+        actionButton.setOnClickListener { onAction() }
+        actionButton.visibility = VISIBLE
+    }
+
+    /**
+     * Moves TalkBack focus to the title, since this view replaces content that
+     * could have held it.
+     *
+     * This is what announces the view, which is why it sets no accessibility
+     * pane title: that announces on appearance, so TalkBack would read the title
+     * once for the pane and again for the focus landing on it.
+     */
+    fun focusTitleForAccessibility() {
+        titleText.performAccessibilityAction(AccessibilityNodeInfo.ACTION_ACCESSIBILITY_FOCUS, null)
+    }
+
+    private fun setTitle(title: CharSequence) {
+        titleText.text = title
+    }
+
+    private fun clearAction() {
+        actionButton.setOnClickListener(null)
+        actionButton.visibility = GONE
+    }
+
+    /**
+     * A [MaterialButton], styled by the host's Material theme, or a platform
+     * [Button] when the host theme is not a Material theme, which
+     * [MaterialButton] requires.
+     */
+    private fun createActionButton(): Button {
+        // The attribute Material's theme check looks for.
+        val isMaterialTheme = context.theme.resolveAttribute(
+            com.google.android.material.R.attr.colorPrimaryVariant,
+            TypedValue(),
+            true
+        )
+        return if (isMaterialTheme) MaterialButton(context) else Button(context)
     }
 
     private fun dpToPx(dp: Int): Int {

android/Gutenberg/src/main/res/drawable/gbk_ic_editor_error.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:tint="?android:attr/textColorSecondary"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+    <path
+        android:fillColor="@android:color/white"
+        android:fillType="evenOdd"
+        android:pathData="M12,2A10,10 0,0 1,12 22A10,10 0,0 1,12 2ZM12,4A8,8 0,0 1,12 20A8,8 0,0 1,12 4ZM11,7h2v6h-2ZM11,15h2v2h-2Z" />
+</vector>

android/Gutenberg/src/main/res/values/strings.xml

@@ -13,4 +13,17 @@
     <string name="gbk_block_inserter_photos">Photos</string>
     <string name="gbk_block_inserter_camera">Camera</string>
     <string name="gbk_block_inserter_camera_unavailable">Camera not available on this device</string>
+
+    <!-- Editor states -->
+    <string name="gbk_editor_load_failed_title">Failed to load editor</string>
+    <string name="gbk_editor_load_failed_unknown_error">Unknown error</string>
+    <string name="gbk_editor_crashed_title">The editor stopped working</string>
+    <!--
+      Deliberately makes no claim about whether the user's work was saved.
+      Whether anything was persisted depends entirely on the host: some mirror
+      the editor's content continuously, others read it only when the user
+      saves, and the editor cannot tell which.
+    -->
+    <string name="gbk_editor_crashed_description">Reload the editor to continue editing.</string>
+    <string name="gbk_editor_crashed_reload">Reload Editor</string>
 </resources>