feat: export buildTREFromConfig for testing

meliorence · Jun 4, 2021 · c13e1a7 · c13e1a7
1 parent 1c1ce42
commit c13e1a7
Show file tree

Hide file tree

Showing 3 changed files with 83 additions and 75 deletions.
diff --git a/packages/render-html/src/helpers/buildTREFromConfig.ts b/packages/render-html/src/helpers/buildTREFromConfig.ts
@@ -0,0 +1,73 @@
+import { TransientRenderEngineConfig } from '../shared-types';
+import TRenderEngine, {
+  HTMLModelRecord,
+  TagName
+} from '@native-html/transient-render-engine';
+
+export default function buildTREFromConfig(props: TransientRenderEngineConfig) {
+  const {
+    allowedStyles,
+    ignoredStyles,
+    ignoredDomTags,
+    ignoreDomNode,
+    domVisitors,
+    htmlParserOptions,
+    baseStyle,
+    classesStyles,
+    tagsStyles,
+    idsStyles,
+    enableCSSInlineProcessing,
+    enableUserAgentStyles,
+    fallbackFonts,
+    systemFonts,
+    customHTMLElementModels = {},
+    emSize,
+    setMarkersForTNode,
+    selectDomRoot,
+    dangerouslyDisableHoisting,
+    dangerouslyDisableWhitespaceCollapsing
+  } = props;
+  const customizeHTMLModels = Object.keys(customHTMLElementModels).length
+    ? (defaultModels: HTMLModelRecord<TagName>): HTMLModelRecord<TagName> => {
+        return { ...defaultModels, ...customHTMLElementModels };
+      }
+    : undefined;
+  const fontMap = {} as Record<string, true>;
+  systemFonts!.forEach((font) => {
+    fontMap[font] = true;
+  });
+  const isFontSupported = (fontFamily: string) => {
+    if (fallbackFonts![fontFamily as keyof typeof fallbackFonts]) {
+      return fallbackFonts![fontFamily as keyof typeof fallbackFonts];
+    }
+    return fontMap[fontFamily] || false;
+  };
+  return new TRenderEngine({
+    customizeHTMLModels,
+    cssProcessorConfig: {
+      isFontSupported,
+      inlinePropertiesBlacklist: ignoredStyles,
+      inlinePropertiesWhitelist: allowedStyles,
+      rootFontSize: emSize
+    },
+    htmlParserOptions: {
+      decodeEntities: true,
+      ...htmlParserOptions
+    },
+    stylesConfig: {
+      baseStyle,
+      enableCSSInlineProcessing,
+      enableUserAgentStyles,
+      classesStyles,
+      idsStyles,
+      tagsStyles
+    },
+    ignoredDomTags,
+    ignoreDomNode,
+    domVisitors,
+    setMarkersForTNode,
+    selectDomRoot,
+    dangerouslyDisableHoisting,
+    dangerouslyDisableWhitespaceCollapsing
+  });
+}
diff --git a/packages/render-html/src/hooks/useTRenderEngine.ts b/packages/render-html/src/hooks/useTRenderEngine.ts
@@ -1,88 +1,20 @@
 import { useMemo } from 'react';
-import TRenderEngine, {
-  HTMLModelRecord,
-  TagName
-} from '@native-html/transient-render-engine';
 import { TransientRenderEngineConfig } from '../shared-types';
+import buildTREFromConfig from '../helpers/buildTREFromConfig';
 
 /**
  * @internal
  */
-export default function useTRenderEngine(props: TransientRenderEngineConfig) {
-  const {
-    allowedStyles,
-    ignoredStyles,
-    ignoredDomTags,
-    ignoreDomNode,
-    domVisitors,
-    htmlParserOptions,
-    baseStyle,
-    classesStyles,
-    tagsStyles,
-    idsStyles,
-    enableCSSInlineProcessing,
-    enableUserAgentStyles,
-    fallbackFonts,
-    systemFonts,
-    customHTMLElementModels = {},
-    emSize,
-    setMarkersForTNode,
-    selectDomRoot,
-    dangerouslyDisableHoisting,
-    dangerouslyDisableWhitespaceCollapsing,
-    triggerTREInvalidationPropNames
-  } = props;
-  const isFontSupported = useMemo(() => {
-    const fontMap = {} as Record<string, true>;
-    systemFonts!.forEach((font) => {
-      fontMap[font] = true;
-    });
-    return (fontFamily: string) => {
-      if (fallbackFonts![fontFamily as keyof typeof fallbackFonts]) {
-        return fallbackFonts![fontFamily as keyof typeof fallbackFonts];
-      }
-      return fontMap[fontFamily] || false;
-    };
-  }, [systemFonts, fallbackFonts]);
+export default function useTRenderEngine({
+  triggerTREInvalidationPropNames,
+  ...props
+}: TransientRenderEngineConfig) {
   const tbuilderDeps = (triggerTREInvalidationPropNames || []).map(
     (key) => props[key]
   );
-  const customizeHTMLModels = Object.keys(customHTMLElementModels).length
-    ? (defaultModels: HTMLModelRecord<TagName>): HTMLModelRecord<TagName> => {
-        return { ...defaultModels, ...customHTMLElementModels };
-      }
-    : undefined;
   return useMemo(
-    () =>
-      new TRenderEngine({
-        customizeHTMLModels,
-        cssProcessorConfig: {
-          isFontSupported,
-          inlinePropertiesBlacklist: ignoredStyles,
-          inlinePropertiesWhitelist: allowedStyles,
-          rootFontSize: emSize
-        },
-        htmlParserOptions: {
-          decodeEntities: true,
-          ...htmlParserOptions
-        },
-        stylesConfig: {
-          baseStyle,
-          enableCSSInlineProcessing,
-          enableUserAgentStyles,
-          classesStyles,
-          idsStyles,
-          tagsStyles
-        },
-        ignoredDomTags,
-        ignoreDomNode,
-        domVisitors,
-        setMarkersForTNode,
-        selectDomRoot,
-        dangerouslyDisableHoisting,
-        dangerouslyDisableWhitespaceCollapsing
-      }),
+    () => buildTREFromConfig(props),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [...tbuilderDeps, isFontSupported]
+    tbuilderDeps
   );
 }
diff --git a/packages/render-html/src/index.ts b/packages/render-html/src/index.ts
@@ -58,7 +58,10 @@ export type {
   InternalSpecialRenderedTag,
   InternalRendererConfig
 } from './hooks/useInternalRenderer';
+
+// HELPERS
 export { default as splitBoxModelStyle } from './helpers/splitBoxModelStyle';
+export { default as buildTREFromConfig } from './helpers/buildTREFromConfig';
 
 // HOOKS
 export {