Merge pull request #2103 from Shopify/m121

⬆️ Upgrade to m121

.gitmodules

@@ -1,7 +1,7 @@
 [submodule "externals/skia"]
 	path = externals/skia
 	url = https://chromium.googlesource.com/skia/
-	branch = chrome/m119
+	branch = chrome/m121
 [submodule "externals/depot_tools"]
 	path = externals/depot_tools
 	url = https://chromium.googlesource.com/chromium/tools/depot_tools.git

package/src/renderer/__tests__/e2e/SVG.spec.tsx

@@ -55,6 +55,15 @@ const tiger = new SVGAsset(
   800
 );
 
+// const text = new SVGAsset(
+//   `<svg viewBox='0 0 290 500' width='290' height='325' xmlns='http://www.w3.org/2000/svg'>
+// <circle cx='31' cy='325' r='120px' fill='#c02aaa'/>
+// <text x="20" y="35" fill="black">My Text</text>
+// </svg>`,
+//   290,
+//   500
+// );
+
 const svgWithoutSize = {
   __typename__: "SVG" as const,
   width() {
@@ -66,7 +75,7 @@ const svgWithoutSize = {
   dispose() {},
   source() {
     return `<svg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'>
-    <circle cx='10' cy='10' r='10' fill='#00FFFF'/>
+    <circle cx='10' cy='10' r='10' fill='#00FFFF'  />
   </svg>`;
   },
 };
@@ -195,4 +204,14 @@ describe("Displays SVGs", () => {
     );
     checkImage(image, docPath("opacity-tiger.png"));
   });
+
+  // itRunsE2eOnly("can render text", async () => {
+  //   const image = await surface.draw(
+  //     <>
+  //       <Fill color="white" />
+  //       <ImageSVG svg={text} x={0} y={0} width={800} height={800} />
+  //     </>
+  //   );
+  //   checkImage(image, "snapshots/svg/text.png");
+  // });
 });

scripts/build-skia-ios.ts

@@ -1,9 +1,8 @@
 import { configurations } from "./skia-configuration";
-import { executeCmd } from "./utils";
+import { executeCmd, executeCmdSync } from "./utils";
 
 const configuration = configurations.ios;
 
-console.log("Building skia for iOS...");
 let command = "";
 
 Object.keys(configuration.targets).forEach((targetKey) => {
@@ -12,6 +11,7 @@ Object.keys(configuration.targets).forEach((targetKey) => {
     `yarn ts-node ./scripts/build-skia.ts ios ${targetKey}`;
 });
 
+console.log("Building skia for iOS...");
 executeCmd(command, "iOS", () => {
   console.log(`Done building skia for iOS.`);
 });

scripts/build-skia.ts

@@ -1,6 +1,7 @@
 import { executeCmd, executeCmdSync } from "./utils";
 import { exit } from "process";
 import { commonArgs, configurations, PlatformName } from "./skia-configuration";
+
 const fs = require("fs");
 const typedKeys = <T extends object>(obj: T) => Object.keys(obj) as (keyof T)[];
 
@@ -189,13 +190,12 @@ try {
   executeCmdSync("PATH=../depot_tools/:$PATH python3 tools/git-sync-deps");
   console.log("gclient sync done");
 
-  // lets check for any dependencies
-  if (platform.dependencies) {
-    console.log(`Found dependencies for platform ${SelectedPlatform}`);
-    platform.dependencies.forEach((dep) => {
-      console.log(`Running dependency ${dep.name}`);
-      dep.executable();
-    });
+
+  // Generate libgrapheme headers
+  if (SelectedPlatform === "ios") {
+    console.log("Generating libgrapheme headers...");
+    const libgraphemeDir = `./third_party/externals/libgrapheme`;
+    executeCmdSync(`cd ${libgraphemeDir} && ./configure && make clean && make`);
   }
 
   try {

scripts/skia-configuration.ts

@@ -1,6 +1,3 @@
-import { buildLibGraphemeiOS } from "./build-libgrapheme-ios";
-import { executeCmdSync } from "./utils";
-
 const NdkDir: string = process.env.ANDROID_NDK ?? "";
 
 export const BUILD_WITH_PARAGRAPH = true;
@@ -73,7 +70,6 @@ export type Platform = {
   outputRoot: string;
   outputNames: string[];
   options?: Arg[];
-  dependencies?: { name: string; executable: () => void }[];
 };
 
 export const configurations: Configuration = {
@@ -164,11 +160,5 @@ export const configurations: Configuration = {
       "libsksg.a",
       ...ParagraphOutputs,
     ],
-    dependencies: [
-      {
-        name: "libgrapheme",
-        executable: buildLibGraphemeiOS,
-      },
-    ],
   },
 };