How to use the rax.createElement function in rax

// Process pageData from SSR
            const pageData = initialDataFromSSR && initialDataFromSSR.pagePath === component.__path ? initialDataFromSSR.pageData : {};
            // Do not cache getInitialPropsPromise result
            setPageInitialProps(Object.assign({}, { [component.__path]: Object.assign({}, pageData, nextDefaultProps) }));
          }
        }).catch((error) => {
          // In case of uncaught promise.
          throw error;
        });
      });
      // Early return null if initialProps were not get.
      return null;
    }

    if (isWeb) {
      return createElement(
        Navigation,
        Object.assign(
          { appConfig, component, history, routes, InitialComponent },
          pageInitialProps[component.__path]
        )
      );
    }

    return createElement(
      Fragment,
      {},
      createElement(component, Object.assign({ history, routes, InitialComponent }, pageInitialProps[component.__path])),
      createElement(TabBar, { history, config: appConfig.tabBar })
    );
  }
}

it('should works well with named slot', () => {
    function renderFactory(Rax) {
      return function(data) {
        return createElement('view', {}, [data.$slots.default, data.$slots.named]);
      };
    }
    const Comp = createComponent(renderFactory, Rax, { data: {} });
    const tree = renderer.create(createElement(Comp, {}, [
      'child',
      createElement('text', { slot: 'named' }, 'named slot')
    ]));

    expect(tree).toMatchSnapshot();
  });

it('should be drived by rax', (done) => {
    const addEventListener = () => {};
    const postMessage = (message) => {
      expect(message).toMatchSnapshot();
      done();
    };
    const driver = createDriver({ addEventListener, postMessage });
    render(createElement('view'), null, { driver });
  });

it('should normalize props with default values', function() {
    class MyComponent {
      static defaultProps = {prop: 'testKey'};
      render() {
        return <span>;
      }
    }

    var instance = createElement(MyComponent);
    var clonedInstance = cloneElement(instance, {prop: undefined});
    expect(clonedInstance.props.prop).toBe('testKey');
    var clonedInstance2 = cloneElement(instance, {prop: null});
    expect(clonedInstance2.props.prop).toBe(null);

    var instance2 = createElement(MyComponent, {prop: 'newTestKey'});
    var cloneInstance3 = cloneElement(instance2, {prop: undefined});
    expect(cloneInstance3.props.prop).toBe('testKey');
    var cloneInstance4 = cloneElement(instance2, {});
    expect(cloneInstance4.props.prop).toBe('newTestKey');
  });
</span>

function MyComponent() {
          return createElement('div', {}, 'foo');
        }

export default function runApp(appConfig) {
  const { routes, shell, hydrate = false } = appConfig;
  const withSSR = !!window.__INITIAL_DATA__;

  let history;
  if (withSSR) {
    history = createBrowserHistory();
  } else {
    history = createHashHistory();
  }

  let entry = createElement(Entry, { history, routes });

  if (shell) {
    entry = createElement(shell.component, { data: initialData.shellData }, entry);
  }

  if (!launched) {
    launched = true;
    emit('launch');
  }

  render(
    entry,
    document.getElementById('root'),
    { driver: UniversalDriver, hydrate }
  );
}

if (
          haveStatePropsChanged ||
          haveDispatchPropsChanged ||
          haveOwnPropsChanged
        ) {
          haveMergedPropsChanged = this.updateMergedPropsIfNeeded();
        } else {
          haveMergedPropsChanged = false;
        }

        if (!haveMergedPropsChanged && renderedElement) {
          return renderedElement;
        }

        if (withRef) {
          this.renderedElement = createElement(WrappedComponent, {
            ...this.mergedProps,
            ref: 'wrappedInstance'
          });
        } else {
          this.renderedElement = createElement(WrappedComponent,
            this.mergedProps
          );
        }

        return this.renderedElement;
      }

renderEvent({ name, payload }) {
    return createElement(
      View,
      { style: styles.item },
      createElement(Text, null, '----------------------------------'),
      createElement(Text, null, `Name: ${name}`),
      createElement(Text, null, `Payload: ${JSON.stringify(payload)}`),
      createElement(Text, null, '----------------------------------')
    );
  }

const { Router } = useRouter(routerConfig);

  maxSavePathNum = maxSavePath;
  routerProps = props;
  routerList = routes;
  updateComponentTrigger = setUpdateTemp;

  useEffect(() => {
    history.listen(() => {
      updateComponentTrigger(Date.now());
    });
  }, []);


  if (isNode && routerConfig.InitialComponent) {
    return createElement(routerConfig.InitialComponent, props);
  }

  const isKeepAlivePage = !!paths.find(pathItem => pathItem === history.location.pathname);
  const isTabBarPageTabBar = !!items.find(item => item.pagePath === history.location.pathname);

  if (isFirstTimeRender && routerConfig.InitialComponent) {
    isFirstTimeRender = false;
    const getInitialComponent = routerConfig.InitialComponent;
    if (!isTabBarPageTabBar) {
      return createElement(getInitialComponent(), props);
    } else {
      pages[history.location.pathname] = createElement(getInitialComponent(), props);
      delete routerConfig.InitialComponent;
    }
  }

if (isWeb) {
      return createElement(
        Navigation,
        Object.assign(
          { appConfig, component, history, routes, InitialComponent },
          pageInitialProps[component.__path]
        )
      );
    }

    return createElement(
      Fragment,
      {},
      createElement(component, Object.assign({ history, routes, InitialComponent }, pageInitialProps[component.__path])),
      createElement(TabBar, { history, config: appConfig.tabBar })
    );
  }
}