From e21d6a3f055a9f9fe42b2446fba74d750cc648ae Mon Sep 17 00:00:00 2001 From: ncpa0cpl Date: Sun, 9 Jul 2023 20:25:50 +0200 Subject: [PATCH] feat: ContextMap replaced with ComponentApi --- .../render-to-html.test.tsx.snap | 16 ++ __tests__/html-parser/render-to-html.test.tsx | 242 +++++++++++++----- __tests__/utilities/memo.test.tsx | 22 +- .../component-api.ts} | 71 ++++- src/error-boundary/error-boundary.ts | 6 +- src/html-parser/jsx-elem-to-html.ts | 20 +- src/index.ts | 7 +- src/jsx/base-html-tag-props.ts | 10 +- src/jsx/jsx-runtime.ts | 6 +- .../jsx-elem-to-strings.ts | 6 +- src/utilities/memo.ts | 19 +- 11 files changed, 308 insertions(+), 117 deletions(-) rename src/{context-map/context-map.ts => component-api/component-api.ts} (54%) diff --git a/__tests__/html-parser/__snapshots__/render-to-html.test.tsx.snap b/__tests__/html-parser/__snapshots__/render-to-html.test.tsx.snap index 67c295e..2c96c8d 100644 --- a/__tests__/html-parser/__snapshots__/render-to-html.test.tsx.snap +++ b/__tests__/html-parser/__snapshots__/render-to-html.test.tsx.snap @@ -87,6 +87,22 @@ exports[`renderToHTML should correctly parse async components 1`] = ` " `; +exports[`renderToHTML should correctly perform sub renders async render rendered computer can access the context defined on the parent 1`] = ` +"
+
async foo
async foo
async bar
+
" +`; + +exports[`renderToHTML should correctly perform sub renders async render renders a simple component 1`] = `"
Hello World!
"`; + +exports[`renderToHTML should correctly perform sub renders sync render rendered computer can access the context defined on the parent 1`] = ` +"
+
foo
foo
bar
+
" +`; + +exports[`renderToHTML should correctly perform sub renders sync render renders a simple component 1`] = `"
Hello World!
"`; + exports[`renderToHTML should correctly render jsx with arrays in between elements 1`] = ` "

Header

diff --git a/__tests__/html-parser/render-to-html.test.tsx b/__tests__/html-parser/render-to-html.test.tsx index 654725b..df38ccc 100644 --- a/__tests__/html-parser/render-to-html.test.tsx +++ b/__tests__/html-parser/render-to-html.test.tsx @@ -7,9 +7,9 @@ import { import { jsx, Fragment } from "../../src/jsx/jsx-runtime"; import { ContextDefinition, - ContextMap, + ComponentApi, defineContext, -} from "../../src/context-map/context-map"; +} from "../../src/component-api/component-api"; import { ErrorBoundary } from "../../src/error-boundary/error-boundary"; const sleep = (t: number) => @@ -241,9 +241,9 @@ describe("renderToHTML", () => { it("should correctly render jsx with context data", () => { const context = defineContext<{ title: string }>(); - const Header: JSXTE.Component = (_, contextMap) => { - expect(contextMap.has(context)).toBe(true); - const { title } = contextMap.get(context); + const Header: JSXTE.Component = (_, { ctx }) => { + expect(ctx.has(context)).toBe(true); + const { title } = ctx.getOrFail(context); expect(title).toBe("This title is set via the context"); return (
@@ -260,8 +260,8 @@ describe("renderToHTML", () => { ); }; - const App: JSXTE.Component = (_, contextMap) => { - contextMap.set(context, { title: "This title is set via the context" }); + const App: JSXTE.Component = (_, { ctx }) => { + ctx.set(context, { title: "This title is set via the context" }); return ( @@ -299,11 +299,11 @@ describe("renderToHTML", () => { buttonLabel: string; }>(); - const Header: JSXTE.Component = (_, contextMap) => { - expect(contextMap.has(context)).toBe(true); - const { title } = contextMap.get(context); + const Header: JSXTE.Component = (_, { ctx }) => { + expect(ctx.has(context)).toBe(true); + const { title } = ctx.getOrFail(context); - contextMap.set(context, { + ctx.set(context, { title, inputPlaceholder: "This should not affect the rendered content, since this component has no children that consume this context.", @@ -318,16 +318,16 @@ describe("renderToHTML", () => { ); }; - const Input: JSXTE.Component = (_, contextMap) => { - expect(contextMap.has(context)).toBe(true); - const { inputPlaceholder } = contextMap.get(context); + const Input: JSXTE.Component = (_, { ctx }) => { + expect(ctx.has(context)).toBe(true); + const { inputPlaceholder } = ctx.getOrFail(context); expect(inputPlaceholder).toBe("write here"); return ; }; - const Button: JSXTE.Component = (_, contextMap) => { - expect(contextMap.has(context)).toBe(true); - const { buttonLabel } = contextMap.get(context); + const Button: JSXTE.Component = (_, { ctx }) => { + expect(ctx.has(context)).toBe(true); + const { buttonLabel } = ctx.getOrFail(context); expect(buttonLabel).toBe("Submit"); return ; }; @@ -336,8 +336,8 @@ describe("renderToHTML", () => { return <>{[
, , ; @@ -419,8 +419,8 @@ describe("renderToHTML", () => { return <>{[
, ,