[Gutenberg] Upgrade React Native `0.71.11` #20956

SiobhyB · 2023-06-26T16:30:12Z

Related to wordpress-mobile/gutenberg-mobile#5874

This PR contains the following changes:

Bump Gutenberg Mobile reference to the latest commit of GB-mobile branch upgrade/react-native-0.71.8. This incorporates the needed changes for the RN upgrade coming from Gutenberg.
Integration of Gutenberg using XCFramework (further information can be found in this PR).
Fix for failing UI tests caused by the RN upgrade (further information can be found in this PR).

To test:
Follow testing instructions from WordPress/gutenberg#51303.

Regression Notes

Potential unintended areas of impact
None apart from the editor.
What I did to test those areas of impact (or what existing automated tests I relied on)
Manual testing and CI tests.
What automated tests I added (or what prevented me from doing so)
N/A

PR submission checklist:

I have completed the Regression Notes.
I have considered adding unit tests for my changes.
I have considered adding accessibility improvements for my changes.
I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

UI Changes testing checklist:

Portrait and landscape orientations.
Light and dark modes.
Fonts: Larger, smaller and bold text.
High contrast.
VoiceOver.
Languages with large words or with letters/accents not frequently used in English.
Right-to-left languages. (Even if translation isn’t complete, formatting should still respect the right-to-left layout)
iPhone and iPad.
Multi-tasking: Split view and Slide over. (iPad)

Gutenberg/cocoapods_helpers.rb

No other than reason than me looking at the CocoaPods setup and realizing we were a few versions behind.

Despite it working during the prototype stage, I wasn't able to get the XCFrameworks out of the ZIP archive, but it works fine with the tar.gz. I suspect this has to do with the folder(s) generated when decompressing.

These are unnecessary at the moment but will be when we move to Gutenberg via XCFramework

The advantage of this approach is that downloading the archive is only necessary when using a local spec. Defining the logic in the local spec itself keeps everything self contained and saves us from having to conditionally call the `pre_install` hook.

The idea was to use a local spec and interpolated the desired commit SHA1 in the `source` to download the corresponding `tar.gz`. However, CocoaPods has some issues with local specs that use `http` `source`, as documented in: - CocoaPods/CocoaPods#10288 (comment) - https://github.com/firebase/firebase-ios-sdk/blob/68b39b8edf61f6e643e2396e712c7c67e0f146ff/scripts/pod_lib_lint.rb#L70-L78 Using a remote spec doesn't have the same issue, and the cost in terms of extra computation and storage is negligible when compared to building and hosting the `tar.gz` archives.

See wordpress-mobile/gutenberg-mobile@57f9dd1

This was done to address the following CI failure when building with the Gutenberg XCFramework: ``` ▸ Linking WordPress ⚠️ ld: Could not find or use auto-linked library 'swiftCompatibility56' ❌ ld: symbol(s) not found for architecture x86_64 ``` https://buildkite.com/automattic/wordpress-ios/builds/14356#01885545-c05a-43a8-b475-d0d683857672

Because the latest XCFramework setup ships without testing compilation.

Co-authored-by: Tony Li <[email protected]>

…rade/react-native-0.71.11

fluiddot

LGTM 🎊 !

I shared some comments but none should be blocking the PR.

fluiddot · 2023-07-21T10:55:10Z

Gutenberg/cocoapods_helpers.rb

+  # When referencing via a tag or commit, we download pre-built frameworks.
+  return if options.key?(:tag) || options.key?(:commit)


These conditions will never be met as gutenberg_dependencies is only called when using Gutenberg locally, i.e. it will always reference the pod using a path.

Maybe it makes sense to keep it in case gutenberg_dependencies is used somewhere else in the future 🤔.

Gutenberg/cocoapods_helpers.rb

fluiddot · 2023-07-21T11:03:59Z

Gutenberg/cocoapods_helpers.rb

+  # When using an absolute path, we get this error, notice the duplicated "/Users/gio/Developer/a8c/wpios":
+  #
+  #   [!] An error occurred while processing the post-install hook of the Podfile.
+  #
+  #   No such file or directory @ rb_sysopen - <GUTENBERG_MOBILE_PROJECT_PATH>/gutenberg/node_modules/react-native/package.json
+  #


If we confirmed that React Native preprends $PWD, I think we don't need to share details about the error. Hence, we could consider removing this part.

I've applied this suggestion via 7e11b1e.

Scripts/BuildPhases/CopyGutenbergJS.sh

fluiddot · 2023-07-21T11:52:57Z

WordPress/Classes/ViewRelated/Gutenberg/GutenbergViewController.swift

+            @unknown default:
+                fatalError()


For some reason, when building the app using a local installation of Gutenberg, this line (and similar ones below) are giving the following warning when building: Default will never be executed

However, this is not the case when building using the XCFramework 🤔

# Conflicts: # Gutenberg/version.rb # Podfile.lock

…o gutenberg/upgrade/react-native-0.71.11

…ock`

fluiddot · 2023-07-27T09:14:05Z

The CI jobs are failing with the following error after incorporating the latest changes from trunk:

❌ wordpress-ios/WordPress/Classes/ViewRelated/Media/MemoryCache.swift:4:8: no such module 'SDWebImage'
--
  | import SDWebImage
  | ^

The failure is related to this PR and the usage of the library SDWebImage (reference). This library is a transitive dependency of the RNFastImage library, which is only used by the Gutenberg editor.

WordPress-iOS/Gutenberg/cocoapods_helpers.rb

Line 57 in eb05889

RNFastImage

WordPress-iOS/Podfile.lock

Lines 447 to 449 in eb05889

    
           - RNFastImage (8.5.11): 
        
             - React-Core 
        
             - SDWebImage (~> 5.11.1)

Now that Gutenberg is integrated via XCFramework, the RNFastImage library is no longer a dependency in the project (reference). Hence, we have to either re-incorporate it or stop using it. For now, I'll add it to the Podfile (131057d) as I presume we need it but I'd appreciate feedback from the developers involved in the PR to confirm it (cc @kean @staskus @guarani). Thanks for the help 🙇 !

# Conflicts: # WordPress/WordPress.xcodeproj/project.pbxproj

This proposes replaces usage of `SDWebImage` in the new `MemoryCache` following the comment #20956 (comment). It's only being used in one instance, to calculate the cost of objects added to the cache. What's the difference between not passing in a cost and using `sd_memoryCost`? I'm not sure, so I'll share my current understanding and ask for feedback. For images, I don't see a difference because I think the cost is the image's size in bytes. For gifs (also `UIImage`s), the cost calculation seems more complex since I think it's only the number of frames loaded into memory (not the frames that are kept on disk). This PR is meant to start a conversation about which option to take: a. Let `NSCache` calculate the cost and remove `SDWebImage` from the Podfile b. Re-implement a cost calculation and remove `SDWebImage` from the Podfile c. Leave things as-is and close this PR The assumption here is that by removing `SDWebImage`, we're not importing the library twice (once here and once in Gutenberg as a transitive dependency of a RN library).

SiobhyB added the Gutenberg Editing and display of Gutenberg blocks. label Jun 26, 2023

This was referenced Jun 26, 2023

Upgrade React Native 0.71.11 - iOS changes wordpress-mobile/gutenberg-mobile#5881

Merged

[RNMobile] Upgrade React Native 0.71.11 - iOS changes WordPress/gutenberg#51386

Merged

fluiddot reviewed Jun 28, 2023

View reviewed changes

Gutenberg/cocoapods_helpers.rb Outdated Show resolved Hide resolved

This was referenced Jun 29, 2023

[RNMobile] Upgrade React Native 0.71.11 WordPress/gutenberg#51303

Merged

Change the Gutenberg integration to use XCFramework #20717

Closed

mokagio and others added 22 commits July 3, 2023 15:46

Add a local podspec to download Gutenberg XCFramework commit builds

b7fd735

Add check to fail pod install if Gutenberg ZIP doesn't exist at URL

27e6b3f

Use latest CocoaPods version

22334c5

No other than reason than me looking at the CocoaPods setup and realizing we were a few versions behind.

Switch to tar.gz for the Gutenberg XCFramework archive

aca165e

Despite it working during the prototype stage, I wasn't able to get the XCFrameworks out of the ZIP archive, but it works fine with the tar.gz. I suspect this has to do with the folder(s) generated when decompressing.

Use same license as the main project for the Gutenberg pod

211b497

Work around CP not finding XCFrameworks by downloading manually

0aa0487

Add a couple of newly required import React

dffeb71

These are unnecessary at the moment but will be when we move to Gutenberg via XCFramework

Address new warnings introduced by the Gutenberg via XCFramework

1acc425

Update CopyGutenbergJS build phase script to account for XCFramework

8176593

Use relative paths when importing the local Gutenberg podspec

7d31186

Update Gutenberg tar.gz URL after changes in gutenberg-mobile

11b0d2c

See wordpress-mobile/gutenberg-mobile@57f9dd1

Update Gutenberg CP setup to use XCFrameworks when referenced via tag

ede6c5d

Switch to Gutenberg v1.98.1 installed as an XCFramework

0806f9b

Do not @testable import Gutenberg in unit tests

dfae970

Because the latest XCFramework setup ships without testing compilation.

DRY logic setting Gutenberg URL when using tag or commit

4726973

Co-authored-by: Tony Li <[email protected]>

Simplify gutenberg_dependencies with early return

c2c46cc

Co-authored-by: Tony Li <[email protected]>

Update Gutenberg local setup to work with React Native 0.71.11

59d7b78

Add calls to RN hooks when using Gutenberg from local path

d03be58

Update build script to run locally without a Gutenberg App.js

3fcd1b5

fluiddot mentioned this pull request Jul 3, 2023

Upgrade React Native 0.71.11 wordpress-mobile/gutenberg-mobile#5874

Merged

2 tasks

fluiddot force-pushed the gutenberg/upgrade/react-native-0.71.11 branch from 28a6903 to 31a4f10 Compare July 5, 2023 15:44

Merge branch 'mokagio/gutenberg-xcframework-setup' into gutenberg/upg…

64811c6

…rade/react-native-0.71.11

fluiddot mentioned this pull request Jul 21, 2023

[Gutenberg] Tweak Pod dependencies based on React Native version used by Gutenberg #21021

Closed

13 tasks

fluiddot requested review from crazytonyli, jkmassel and geriux July 21, 2023 08:59

fluiddot added this to the 23.0 milestone Jul 21, 2023

fluiddot approved these changes Jul 21, 2023

View reviewed changes

Remove adding React-jsc Pod

c992bcb

fluiddot reviewed Jul 21, 2023

View reviewed changes

fluiddot added 4 commits July 21, 2023 13:57

Remove inline comment about error explanation

7e11b1e

Update Gutenberg Mobile ref

6ce7fdc

Fix typo in CopyGutenbergJS.sh script

59b6bb3

Merge branch 'trunk' into gutenberg/upgrade/react-native-0.71.11

8c8f945

# Conflicts: # Gutenberg/version.rb # Podfile.lock

staskus mentioned this pull request Jul 26, 2023

Crash when opening and closing the editor: C++ Exception: NSt3__112system_errorE #20499

Closed

dcalhoun added 2 commits July 26, 2023 20:46

Merge branch 'trunk' of github.com:wordpress-mobile/WordPress-iOS int…

e39dfaf

…o gutenberg/upgrade/react-native-0.71.11

build: Update Gutenberg version

12164fc

dcalhoun approved these changes Jul 27, 2023

View reviewed changes

fluiddot added 2 commits July 27, 2023 11:10

Re-introduce Gutenberg pod to remove duplicated sources in `Podfile.l…

4642cfb

…ock`

Re-introduce SDWebImage pod

131057d

fluiddot added 3 commits July 27, 2023 11:21

Merge branch 'trunk' into gutenberg/upgrade/react-native-0.71.11

812b034

# Conflicts: # WordPress/WordPress.xcodeproj/project.pbxproj

Update release notes

40541ae

Update Gutenberg Mobile ref with tag

66ad340

fluiddot merged commit 1614edc into trunk Jul 27, 2023

fluiddot deleted the gutenberg/upgrade/react-native-0.71.11 branch July 27, 2023 15:38

twstokes mentioned this pull request Jul 27, 2023

Keyboard automatically resigns and becomes active in an infinite loop wordpress-mobile/gutenberg-mobile#6002

Closed

dcalhoun mentioned this pull request Jul 28, 2023

[Reanimated] EXC_BAD_ACCESS: Exception 1, Code 1, Subcode 167039574753352 > #20990

Closed

guarani mentioned this pull request Aug 8, 2023

Remove SDWebImage dependency #21285

Merged

13 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Gutenberg] Upgrade React Native `0.71.11` #20956

[Gutenberg] Upgrade React Native `0.71.11` #20956

SiobhyB commented Jun 26, 2023 •

edited by fluiddot

Loading

fluiddot left a comment

fluiddot Jul 21, 2023

fluiddot Jul 21, 2023 •

edited

Loading

fluiddot Jul 21, 2023

fluiddot Jul 21, 2023

fluiddot Jul 21, 2023

fluiddot commented Jul 27, 2023

		# When referencing via a tag or commit, we download pre-built frameworks.
		return if options.key?(:tag) \|\| options.key?(:commit)

[Gutenberg] Upgrade React Native 0.71.11 #20956

[Gutenberg] Upgrade React Native 0.71.11 #20956

Conversation

SiobhyB commented Jun 26, 2023 • edited by fluiddot Loading

Regression Notes

fluiddot left a comment

Choose a reason for hiding this comment

fluiddot Jul 21, 2023

Choose a reason for hiding this comment

fluiddot Jul 21, 2023 • edited Loading

Choose a reason for hiding this comment

fluiddot Jul 21, 2023

Choose a reason for hiding this comment

fluiddot Jul 21, 2023

Choose a reason for hiding this comment

fluiddot Jul 21, 2023

Choose a reason for hiding this comment

fluiddot commented Jul 27, 2023

[Gutenberg] Upgrade React Native `0.71.11` #20956

[Gutenberg] Upgrade React Native `0.71.11` #20956

SiobhyB commented Jun 26, 2023 •

edited by fluiddot

Loading

fluiddot Jul 21, 2023 •

edited

Loading