Using git patch or how to live with your packages not updating

There’s a longstanding bug in react-native that has been active since 2018. Korean text is broken on iOS (especially if you move the input cursor to the beginning of the line)

https://github.com/facebook/react-native/issues/19339

Various fixes were merged and reverted over the years (they cause problems in some other places)

Recently (2022 – 4 years later), a better fix were merged into react-native’s main branch

https://github.com/facebook/react-native/pull/32523

However it’s still unclear when this will get released, and it will take even more time for us to upgrade react-native

In order to use this in our final product, we’ll need to patch react-native manually

  1. Download react-native normally via npm install
  2. Patch node_modules/react-native/Libraries/Text/TextInput/RCTBaseTexinputView.m
  3. Build the project

Generating the patch

Let’s download the react-native repository

git clone https://github.com/facebook/react-native.git

You’ll find that it take a veeery long time

Let’s just get the last 1,000 commits instead

git clone --depth 1000 https://github.com/facebook/react-native.git

Much faster!

Next, reset the branch to the commit we want to extract (You can get the commit ID from the pull request, look at the end)

git reset --hard 1a83dc36ce0af33ac7a3c311354fce4bfa5ba1a3

Next, generate the patch file

git format-patch -1 main Libraries/Text/TextInput/RCTBaseTextInputView.m

Explanation

  • git format-patch: generate patch file
  • -1: from last 1 commit
  • main: from main branch
  • Libraries/Text/TextInput/RCTBaseTextInputView.m: patch to the file, omit to generate patch for the whole commit

Applying the patch

A cursory search on the internet will give you some npm package that you should install to apply a patch file. However, most *nix environment have a tool called patch already installed. We can utilize this

Let’s add some script to `package.json`:

    "patch-3882": "patch -st -p1 -d node_modules/react-native < patches/3882-fix-reactnative-textinput.patch",
    "pod": "pod-install",
    "postinstall": "npm run patch-3882; npm run pod",
    "postuninstall": "npm run patch-3882; npm run pod",

Explanation

  • postinstall / postuninstall will run after each package installation with npm. This will ensure our version of react-native stays patched. Also this will work on your existing build pipelines
  • patch-3882: name of your custom build action
  • patch: the patch command
  • -st: run silently, ignore errors, assume the best
  • -p1: convert git’s format to patch format by truncating the first level of directory from the patch file
  • -d: specify the working directory, in this case, react-native’s
  • < patchfile: pipe the patchfile into the patch command, this is not an input parameter

Gotchas:

  • don’t use “&&” to combine commands, use “;” if you are using Microsoft AppCenter to build your binaries. “&&” will give an “unexpected end of file” error due to the shell on the build agent

TIL (react native, EC2, gvm)

react-native

Launching two instances of a react-native project in two simulators

You’ll see this error when you try to run the second instance

error Failed to launch the app on simulator, An error was encountered processing the command (domain=com.apple.CoreSimulator.SimError, code=405):
Unable to lookup in current state: Shutdown

This is because react-native runner won’t start the second emulator instance automatically. You need to start it by opening xcode -> window -> devices & simulators -> simulators -> start the desired simulator.

Then you can run npx react-native run-ios --simulator="iPhone XXX" again

Or you can just run the program in XCode and select the second simulator.

When cannot connect to EC2 instance with external IP

  • Check the subnet’s routing table
  • There should be an igw-something route. If not, won’t be able to connect to the instance from the internet
  • Select a different subnet if such a function is desired
  • Don’t need to allocate an Elastic IP address

gvm install go1.14

  • Will install go 1.14.0 (not the latest version of go)
  • Must specify specific version of go to install latest (which is different from nvm)

Run Flutter app on iOS 2021 edition

You need an apple developer account and XCode

Open the Flutter app in XCode

In Android Studio, go to Tools / Flutter / Open iOS module in XCode. I know, using ANDROID studio to make apps for an iPhone…

Prepare XCode

Connect your phone to the computer. On the top left part, click Runner > and select your phone. If you don’t see your device you’ll need to troubleshoot, don’t select “Any iOS device”

Go to XCode / Preferences / Account tab, press the plus button, select Apple ID and login to your Developer account. You’ll be prompted for keychain access, allow all. After you are done, make sure a team is available. Some tutorials made you do this step by manually creating a CSR key on your computer and upload it to Apple, following the wizard in XCode is much easier

Next, select runner on the left pane, and select signing & capabilities, make sure automatically manage signing is selected

Remotely debug your app

  • In XCode, select Windows / Device and simulators
  • Click on your phone, check the connect via network button

Wait until there’s a globe next to your phone’s name. That’s it, you can now disconnect your phone from the computer and deploy your app remotely to your phone by clicking the Run button

The run button

Lessons building a JMeter/Caliper benchmarking system

Remote SSH access

  • While it seemed convenient at first, actually we can’t use remote access libraries like JSch http://www.jcraft.com/jsch/ or sshj https://github.com/hierynomus/sshj
    • These libraries re-implemented the ssh protocol and is based upon bouncy castle https://www.bouncycastle.org/
    • Bouncy castle, in turn requires a highly randomized source from the OS. But Amazon EC2 are virtual environment and thus have very little randomness
    • As a result, these libraries will hang for a long time, and may never complete
    • Solution: simply call the os’ natively installed ssh executable. It seems this has been modified to accomodate the environment and work much faster. This also reduced dependency on external libraries (don’t have to download jsch or sshj from maven)
    • Downside: while Jetmeter is written in java, dependency on ssh and scp means it can only run on MacOS or Linux

JMeter

  • While JMeter can be embedded as a library https://mvnrepository.com/artifact/org.apache.jmeter , this approach have the following downsides
    • You need to download external libraries
    • If you use JMeter plugins, you need to include those plugins as libraries, increasing the size of the build a lot
    • You’ll still need to include the JMeter binary and extension directory (yes, you need both build time and run time access)
    • This is due to historical reasons. JMeter has been developed a long time ago and they couldn’t break old conventions.
    • Including JMeter in our application will affect
      • Security. Any JMeter vulnerability will affect our application too
      • JMeter has a tendency to hang. Once we hand over control to the JMeter library it’s hard to take back, the only way is to fork a new process.
    • When we go with process forking, it’s hard to monitor the progress of JMeter (you need to constantly check for result files as JMeter provide no internal method for this)
    • JMeter was built to be mainly run from the command line. To do even basic operation like launching remote controller would require convoluted object instantiation and reflection to access JMeter’s internal types
    • Solution: Since we need to include JMeter library anyway, just call it as an external application and wait for it to finish

Caliper

  • When running Caliper via a remote session, caliper sometimes end the session during test (after around 5 seconds), but still running on the remote host
    • Can’t depend on caliper output
    • Can’t depend on the time caliper exit thread for control flow
    • Need to periodically pool caliper report file on remote host
    • Need to parse said file instead of console output

Migrating to Obsidian

Recently someone released Foam for VSCode on Obsidian, it led me down a rabbit hole of Second brain and Zettelkasten method. In short: it’s an enhanced mindmap with text, images and link between articles

Sound similar to a wiki? Yes. Shall I try out this new thing? Also yes.

So I started to Migrate all my notes to Obsidian, an excellent implementation of this idea (and it’s free for personal use).

My notes a scattered between SimpleNote, Google Keep and OneNote

Migrating from SimpleNote

You can export your notes to HTML from the web app. Then convert HTML to MD with pandoc

Migrating from Google Keep

You can use google Takeout to export your Keep notes to a bunch of HTML files, then use pandoc. You may need to edit the resulting md files a little bit. VS Code is an excellent tool for this

Migrating from OneNote

This is where most of my notes are, and is the most involved. You need

  • A Windows machine
  • OneNote Office Version (not the Windows Store version)

Use this script https://github.com/rab-bit/ConvertOneNote2MarkDown4Obsidian and follow the instruction. This is an updated version of the original script here with various bugs fixed.