Fix for Placeholder that is missing on heading block

__mocks__/styleMock.js

@@ -28,4 +28,7 @@ module.exports = {
 	blockHolderFocused: {
 		borderColor: 'gray',
 	},
+	'wp-block-heading': {
+		minHeight: 60,
+	},
 };

react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecManager.java

@@ -5,6 +5,7 @@
 import android.graphics.Typeface;
 import android.support.annotation.Nullable;
 import android.text.Editable;
+import android.text.TextUtils;
 import android.text.TextWatcher;
 import android.util.Log;
 import android.util.TypedValue;
@@ -63,6 +64,8 @@ public class ReactAztecManager extends SimpleViewManager<ReactAztecText> {
 
     private static final String TAG = "ReactAztecText";
 
+    private static final String BLOCK_TYPE_TAG_KEY = "tag";
+
     public ReactAztecManager() {
         initializeFocusAndBlurCommandCodes();
     }
@@ -302,6 +305,13 @@ public void setColor(ReactAztecText view, @Nullable Integer color) {
         view.setTextColor(newColor);
     }
 
+    @ReactProp(name = "blockType")
+    public void setBlockType(ReactAztecText view, ReadableMap inputMap) {
+        if (inputMap.hasKey(BLOCK_TYPE_TAG_KEY)) {
+            view.setTagName(inputMap.getString(BLOCK_TYPE_TAG_KEY));
+        }
+    }
+
     @ReactProp(name = "placeholder")
     public void setPlaceholder(ReactAztecText view, @Nullable String placeholder) {
         view.setHint(placeholder);
@@ -489,13 +499,14 @@ public void onTextChanged(CharSequence s, int start, int before, int count) {
                 return;
             }
 
+            int currentEventCount = mEditText.incrementAndGetEventCounter();
             // The event that contains the event counter and updates it must be sent first.
             // TODO: t7936714 merge these events
             mEventDispatcher.dispatchEvent(
                     new ReactTextChangedEvent(
                             mEditText.getId(),
                             mEditText.toHtml(false),
-                            mEditText.incrementAndGetEventCounter()));
+                            currentEventCount));
 
             mEventDispatcher.dispatchEvent(
                     new ReactTextInputEvent(
@@ -504,6 +515,11 @@ public void onTextChanged(CharSequence s, int start, int before, int count) {
                             oldText,
                             start,
                             start + before));
+
+            // Add the outer tags when the field was started empty, and only the first time the user types in it.
+            if (mPreviousText.length() == 0 && currentEventCount == 1 && !TextUtils.isEmpty(mEditText.getTagName())) {
+                mEditText.fromHtml('<' + mEditText.getTagName() + '>' + newText + "</" + mEditText.getTagName() + '>', false);
+            }
         }
 
         @Override

react-native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java

@@ -21,7 +21,6 @@
 import com.facebook.react.uimanager.UIManagerModule;
 import com.facebook.react.uimanager.events.EventDispatcher;
 import com.facebook.react.views.textinput.ContentSizeWatcher;
-import com.facebook.react.views.textinput.ReactTextChangedEvent;
 import com.facebook.react.views.textinput.ReactTextInputLocalData;
 import com.facebook.react.views.textinput.ScrollWatcher;
 
@@ -35,7 +34,6 @@
 import java.util.LinkedList;
 import java.util.Set;
 import java.util.HashSet;
-import java.util.Map;
 import java.util.HashMap;
 
 import static android.content.ClipData.*;
@@ -66,6 +64,11 @@ public class ReactAztecText extends AztecText {
     boolean shouldHandleOnSelectionChange = false;
     boolean shouldHandleActiveFormatsChange = false;
 
+    // This optional variable holds the outer HTML tag that will be added to the text when the user start typing in it
+    // This is required to keep placeholder text working, and start typing with styled text.
+    // Ref: https://github.com/wordpress-mobile/gutenberg-mobile/issues/707
+    private String mTagName = "";
+
     private static final HashMap<ITextFormat, String> typingFormatsMap = new HashMap<ITextFormat, String>() {
         {
             put(AztecTextFormat.FORMAT_BOLD, "bold");
@@ -241,6 +244,14 @@ public void run() {
         setIntrinsicContentSize();
     }
 
+    public void setTagName(@Nullable String tagName) {
+        this.mTagName = tagName;
+    }
+
+    public String getTagName() {
+        return this.mTagName;
+    }
+
     private void updateToolbarButtons(int selStart, int selEnd) {
         ArrayList<ITextFormat> appliedStyles = getAppliedStyles(selStart, selEnd);
         updateToolbarButtons(appliedStyles);

src/_variables.android.scss

@@ -8,4 +8,4 @@ $title-block-padding-bottom: 0;
 
 $min-height-title: 53;
 $min-height-paragraph: 50;
-$min-height-heading: 50;
+$min-height-heading: 60;