From 2a80ba544e4ad3ce46b896a75cc29d4a751d9842 Mon Sep 17 00:00:00 2001 From: Joe Savona Date: Mon, 15 May 2023 12:12:53 -0700 Subject: [PATCH] Move DisableJsxMemoization-test into main compiler test w pragma I originally created a separate test for the mode with JSX memoization disabled, but we can merge this into the main compiler-test and enable the feature with a pragma. --- .../forget/src/__tests__/compiler-test.ts | 2 + .../disableMemoizeJsxElements-test.ts | 112 ------------------ .../disable-jsx-memoization.expect.md} | 3 +- .../disable-jsx-memoization.js} | 1 + .../test-utils/generateTestsFromFixtures.ts | 6 +- 5 files changed, 10 insertions(+), 114 deletions(-) delete mode 100644 compiler/forget/src/__tests__/disableMemoizeJsxElements-test.ts rename compiler/forget/src/__tests__/fixtures/{disableMemoizeJsxElements/Component.expect.md => compiler/disable-jsx-memoization.expect.md} (85%) rename compiler/forget/src/__tests__/fixtures/{disableMemoizeJsxElements/Component.js => compiler/disable-jsx-memoization.js} (88%) diff --git a/compiler/forget/src/__tests__/compiler-test.ts b/compiler/forget/src/__tests__/compiler-test.ts index cda5f2d575..0e233b6875 100644 --- a/compiler/forget/src/__tests__/compiler-test.ts +++ b/compiler/forget/src/__tests__/compiler-test.ts @@ -44,6 +44,8 @@ describe("React Forget", () => { enableOnlyOnUseForgetDirective: options.enableOnlyOnUseForgetDirective, environment: { + memoizeJsxElements: + options.environment?.memoizeJsxElements ?? true, customHooks: new Map([ [ "useFreeze", diff --git a/compiler/forget/src/__tests__/disableMemoizeJsxElements-test.ts b/compiler/forget/src/__tests__/disableMemoizeJsxElements-test.ts deleted file mode 100644 index 1148bc2aed..0000000000 --- a/compiler/forget/src/__tests__/disableMemoizeJsxElements-test.ts +++ /dev/null @@ -1,112 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -"use strict"; - -import path from "path"; -import { runReactForgetBabelPlugin } from "../Babel/RunReactForgetBabelPlugin"; -import { toggleLogging } from "../Utils/logger"; -import { Effect, ValueKind } from "../index"; -import generateTestsFromFixtures from "./test-utils/generateTestsFromFixtures"; - -type TestOutput = { - js: string; -}; - -function wrapWithTripleBackticks(s: string, ext?: string) { - return `\`\`\`${ext ?? ""} -${s} -\`\`\``; -} - -describe("React Forget (Disable memoization of JSX elements)", () => { - generateTestsFromFixtures( - path.join(__dirname, "fixtures", "disableMemoizeJsxElements"), - (input, file, options) => { - let items: Array = []; - let error: Error | null = null; - if (options.debug) { - toggleLogging(options.debug); - } - try { - items.push({ - js: runReactForgetBabelPlugin(input, file, options.language, { - enableOnlyOnUseForgetDirective: - options.enableOnlyOnUseForgetDirective, - environment: { - memoizeJsxElements: false, - customHooks: new Map([ - [ - "useFreeze", - { - name: "useFreeze", - kind: "Custom", - valueKind: ValueKind.Frozen, - effectKind: Effect.Freeze, - }, - ], - ]), - inlineUseMemo: options.environment?.inlineUseMemo ?? false, - }, - logger: null, - gating: options.gating, - panicOnBailout: options.panicOnBailout, - }).code, - }); - } catch (e) { - error = e; - } - let outputs: Array; - - const expectError = file.startsWith("error."); - if (expectError) { - if (error === null) { - throw new Error( - `Expected an error to be thrown for fixture: '${file}', remove the 'error.' prefix if an error is not expected.` - ); - } else { - outputs = [formatErrorOutput(error)]; - } - } else { - if (error !== null) { - error.message = `Expected fixture '${file}' to succeed but it failed with error:\n\n${error.message}`; - throw error; - } - if (items === null || items.length === 0) { - throw new Error(`Expected at least one output for file '${file}'.`); - } - outputs = formatOutput(items); - } - return ` -## Input - -${wrapWithTripleBackticks(input, "javascript")} - -${outputs.join("\n")} - `; - } - ); -}); - -function formatErrorOutput(error: Error): string { - error.message = error.message.replace(/^\/.*?:\s/, ""); - return ` -## Error - -${wrapWithTripleBackticks(error.message)} - `; -} - -function formatOutput(items: Array): Array { - return items.map(({ js }) => { - return ` -## Code - -${wrapWithTripleBackticks(js, "javascript")} - `.trim(); - }); -} diff --git a/compiler/forget/src/__tests__/fixtures/disableMemoizeJsxElements/Component.expect.md b/compiler/forget/src/__tests__/fixtures/compiler/disable-jsx-memoization.expect.md similarity index 85% rename from compiler/forget/src/__tests__/fixtures/disableMemoizeJsxElements/Component.expect.md rename to compiler/forget/src/__tests__/fixtures/compiler/disable-jsx-memoization.expect.md index dc1eb2d124..02edc84ed3 100644 --- a/compiler/forget/src/__tests__/fixtures/disableMemoizeJsxElements/Component.expect.md +++ b/compiler/forget/src/__tests__/fixtures/compiler/disable-jsx-memoization.expect.md @@ -2,6 +2,7 @@ ## Input ```javascript +// @memoizeJsxElements false function Component(props) { const [name, setName] = useState(null); const onChange = function (e) { @@ -19,7 +20,7 @@ function Component(props) { ## Code ```javascript -import { unstable_useMemoCache as useMemoCache } from "react"; +import { unstable_useMemoCache as useMemoCache } from "react"; // @memoizeJsxElements false function Component(props) { const $ = useMemoCache(2); const [name, setName] = useState(null); diff --git a/compiler/forget/src/__tests__/fixtures/disableMemoizeJsxElements/Component.js b/compiler/forget/src/__tests__/fixtures/compiler/disable-jsx-memoization.js similarity index 88% rename from compiler/forget/src/__tests__/fixtures/disableMemoizeJsxElements/Component.js rename to compiler/forget/src/__tests__/fixtures/compiler/disable-jsx-memoization.js index 98a0b104c5..42125e01a7 100644 --- a/compiler/forget/src/__tests__/fixtures/disableMemoizeJsxElements/Component.js +++ b/compiler/forget/src/__tests__/fixtures/compiler/disable-jsx-memoization.js @@ -1,3 +1,4 @@ +// @memoizeJsxElements false function Component(props) { const [name, setName] = useState(null); const onChange = function (e) { diff --git a/compiler/forget/src/__tests__/test-utils/generateTestsFromFixtures.ts b/compiler/forget/src/__tests__/test-utils/generateTestsFromFixtures.ts index 7590ec5fa7..afc210f626 100644 --- a/compiler/forget/src/__tests__/test-utils/generateTestsFromFixtures.ts +++ b/compiler/forget/src/__tests__/test-utils/generateTestsFromFixtures.ts @@ -96,6 +96,7 @@ export default function generateTestsFromFixtures( let gating: GatingOptions | null = null; let inlineUseMemo = true; let panicOnBailout = true; + let memoizeJsxElements = true; if (inputFile != null) { input = fs.readFileSync(inputFile, "utf8"); @@ -124,13 +125,16 @@ export default function generateTestsFromFixtures( if (lines[0]!.indexOf("@panicOnBailout false") !== -1) { panicOnBailout = false; } + if (lines[0]!.indexOf("@memoizeJsxElements false") !== -1) { + memoizeJsxElements = false; + } } testCommand(basename, () => { let receivedOutput; if (input !== null) { receivedOutput = transform(input, basename, { - environment: { inlineUseMemo }, + environment: { inlineUseMemo, memoizeJsxElements }, logger: null, debug, enableOnlyOnUseForgetDirective,