Using mount() causes out-of-memory errors #2405

20BBrown14 · 2020-06-20T02:24:12Z

Running an issue where if I use mount() in a snapshot test it fails with a Javacript out of memory error[1]. If I increase the memory to >4GB with NODE_OPTIONS=--max-old-space-size=4096 on my test script there is no longer a Javascript out-of-memory issue but instead a "Invalid string length" issue[2] which I'm not sure is related to enzyme. I would like to be able to run tests as needed without having to allocate a quarter of my system's memory to it haha

Important to note that render() and shallow() both work as expected

[1]

<--- Last few GCs --->

[7845:0x3246030]    34263 ms: Mark-sweep 1392.3 (1425.4) -> 1391.6 (1425.9) MB, 676.9 / 0.0 ms  (average mu = 0.114, current mu = 0.048) allocation failure scavenge might not succeed
[7845:0x3246030]    35422 ms: Mark-sweep 1392.4 (1425.9) -> 1391.9 (1425.4) MB, 1126.7 / 0.0 ms  (average mu = 0.064, current mu = 0.029) allocation failure scavenge might not succeed


<--- JS stacktrace --->

==== JS stack trace =========================================

    0: ExitFrame [pc: 0x1e5ba5fdbe1d]
    1: StubFrame [pc: 0x1e5ba5f9059d]
Security context: 0x1355cf61e6c1 <JSObject>
    2: /* anonymous */(aka /* anonymous */) [0x1dcc04fc00a1] [<path>/digitalterrainmcwebsite/digital-terrain-mc-js/node_modules/jest-snapshot/node_modules/pretty-format/build/plugins/lib/markup.js:~25] [pc=0x1e5ba6368c3f](this=0x1ac8905826f1 <undefined>,key=0x0097665d7c91 <String[17]: builtinPlacements>)
    3: ar...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0x8fb090 node::Abort() [<path>/.nvm/versions/node/v10.21.0/bin/node]
 2: 0x8fb0dc  [<path>/.nvm/versions/node/v10.21.0/bin/node]
 3: 0xb0322e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [<path>/.nvm/versions/node/v10.21.0/bin/node]
 4: 0xb03464 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [<path>/.nvm/versions/node/v10.21.0/bin/node]
 5: 0xef74c2  [<path>/.nvm/versions/node/v10.21.0/bin/node]
 6: 0xef75c8 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [<path>/.nvm/versions/node/v10.21.0/bin/node]
 7: 0xf036a2 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [<path>/.nvm/versions/node/v10.21.0/bin/node]
 8: 0xf03fd4 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [<path>/.nvm/versions/node/v10.21.0/bin/node]
 9: 0xf06c41 v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) <path>/.nvm/versions/node/v10.21.0/bin/node]
10: 0xed00c4 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationSpace) [<path>/.nvm/versions/node/v10.21.0/bin/node]
11: 0x117024e v8::internal::Runtime_AllocateInNewSpace(int, v8::internal::Object**, v8::internal::Isolate*) <path>/.nvm/versions/node/v10.21.0/bin/node]
12: 0x2936fc85be1d

[2]

PrettyFormatPluginError: Invalid string lengthRangeError: Invalid string length

      at printObjectProperties (node_modules/jest-snapshot/node_modules/pretty-format/build/collections.js:172:47)
          at Array.map (<anonymous>)
          at Array.map (<anonymous>)
          at Array.map (<anonymous>)
          at Array.map (<anonymous>)

A worker process has failed to exit gracefully and has been force exited. This is likely caused by tests leaking due to improper teardown. Try running with --runInBand --detectOpenHandles to find leaks.

Current behavior

Javascript out-of-memory error when using mount() in a snapshot test

Expected behavior

Enzyme should probably not be running out of memory especially for such a simple dom

Your environment

Jest: I've tried Jest 24, 25, and 26
enzyme-to-json: I've tried 3.4.4 and 3.5.0
Node: I tried lts/dubnium & lts/erbium

Ubuntu 16.04 LTS
Also reproduced on MacOS Catalina

API

shallow
mount
render

Version

library	version
enzyme	3.4.4 & 3.5.0
react	16.13.1
react-dom	16.13.1
react-test-renderer	N/A (should I be using this?)
adapter (below)

Adapter

The text was updated successfully, but these errors were encountered:

ljharb · 2020-06-20T07:25:16Z

enzyme doesn't actually support snapshot tests - the closest would be .debug(). I'm not sure why this would be using so much memory. What does wrapper.debug() print out?

ljharb · 2020-06-20T07:26:00Z

(see #1642)

20BBrown14 · 2020-06-20T14:14:47Z

@ljharb Thanks for replying. Ya, I guess I wasn't exactly sure where the issue was and since the issue was only with mount() and not render() or shallow() I thought I would post here. Sorry about that.

This is the output of wrapper.debug() though. It's huge which is a cause for concern, and definitely not this big when using render(). Since is the issue only seems to be present when trying to snapshot a mounted component, and not while actually mounting it, would you suggest I use render for snapshot tests? And I could still use mount for functional or lifecycle testing if needed

 <HeaderView>
      <div>
        <Menu selectedKeys={{...}} mode="horizontal" className="header-menu">
          <InternalMenu selectedKeys={{...}} mode="horizontal" className="header-menu" theme="light" focusable={false}>
            <Menu getPopupContainer={[undefined]} selectedKeys={{...}} mode="horizontal" className="header-menu ant-menu-light" theme="light" focusable={false} openKeys={{...}} onOpenChange={[Function]} motion={{...}} onClick={[Function]} prefixCls="ant-menu" onTransitionEnd={[Function]} onMouseEnter={[Function]} direction={[undefined]} selectable={true} onSelect={[Function: noop]} onDeselect={[Function: noop]} defaultSelectedKeys={{...}} defaultOpenKeys={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" style={{...}} builtinPlacements={{...}} overflowedIndicator={{...}}>
              <Provider store={{...}}>
                <Connect(SubPopupMenu) getPopupContainer={[undefined]} selectedKeys={{...}} mode="horizontal" className="header-menu ant-menu-light ant-menu-root" theme="light" focusable={false} openKeys={{...}} onOpenChange={[Function]} motion={{...}} onClick={[Function]} prefixCls="ant-menu" onTransitionEnd={[Function]} onMouseEnter={[Function]} direction={[undefined]} selectable={true} onSelect={[Function]} onDeselect={[Function]} defaultSelectedKeys={{...}} defaultOpenKeys={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" style={{...}} builtinPlacements={{...}} overflowedIndicator={{...}} parentMenu={{...}}>
                  <SubPopupMenu getPopupContainer={[undefined]} selectedKeys={{...}} mode="horizontal" className="header-menu ant-menu-light ant-menu-root" theme="light" focusable={false} openKeys={{...}} onOpenChange={[Function]} motion={{...}} onClick={[Function]} prefixCls="ant-menu" onTransitionEnd={[Function]} onMouseEnter={[Function]} direction={[undefined]} selectable={true} onSelect={[Function]} onDeselect={[Function]} defaultSelectedKeys={{...}} defaultOpenKeys={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" style={{...}} builtinPlacements={{...}} overflowedIndicator={{...}} parentMenu={{...}} store={{...}} level={1} inlineIndent={24} visible={true} manualRef={[Function: noop]}>
                    <DOMWrap className="ant-menu header-menu ant-menu-light ant-menu-root ant-menu-horizontal" onTransitionEnd={[Function]} onMouseEnter={[Function]} direction={[undefined]} style={{...}} prefixCls="ant-menu" mode="horizontal" tag="ul" level={1} theme="light" visible={true} overflowedIndicator={{...}} role="menu">
                      <ul className="ant-menu header-menu ant-menu-light ant-menu-root ant-menu-horizontal" onTransitionEnd={[Function]} onMouseEnter={[Function]} direction={[undefined]} style={{...}} role="menu">
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Icon-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Icon-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem disabled={true} icon={{...}} className="header-icon-menu-item" mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={0} parentMenu={{...}} manualRef={[undefined]} eventKey="Icon" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) disabled={true} className="header-icon-menu-item ant-menu-item-only-child" mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={0} parentMenu={{...}} manualRef={[undefined]} eventKey="Icon" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem disabled={true} className="header-icon-menu-item ant-menu-item-only-child" mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={0} parentMenu={{...}} manualRef={[Function: noop]} eventKey="Icon" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li className="ant-menu-item header-icon-menu-item ant-menu-item-only-child ant-menu-item-disabled" onClick={{...}} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={{...}} onMouseLeave={{...}} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={true} style={{...}}>
                                      <img src="test-file-stub" alt="loading..." className="header-icon" />
                                      <span />
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Title-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Title-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem className="header-title" mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={1} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Title" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) className="header-title ant-menu-item-only-child" mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={1} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Title" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem className="header-title ant-menu-item-only-child" mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={1} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Title" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li className="ant-menu-item header-title ant-menu-item-only-child" onClick={[Function]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      Digital Terrain
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Home-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Home-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={2} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Home" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={2} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Home" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={2} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Home" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li onClick={[Function]} className="ant-menu-item ant-menu-item-only-child" onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      Home
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Gallery-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Gallery-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={3} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Gallery" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={3} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Gallery" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={3} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Gallery" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li onClick={[Function]} className="ant-menu-item ant-menu-item-only-child" onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      Gallery
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Map-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Map-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={4} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Map" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={4} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Map" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={4} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Map" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li onClick={[Function]} className="ant-menu-item ant-menu-item-only-child" onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      Map
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Rules-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Rules-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={5} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Rules" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={5} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Rules" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={5} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Rules" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li onClick={[Function]} className="ant-menu-item ant-menu-item-only-child" onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      Rules
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Apply-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="Apply-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={6} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Apply" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={6} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Apply" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={6} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="Apply" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li onClick={[Function]} className="ant-menu-item ant-menu-item-only-child" onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      Apply
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="About-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="About-overflowed-indicator" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                        <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={7} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="About" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]}>
                          <Tooltip title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true}>
                            <ForwardRef(Tooltip) title={{...}} visible={false} placement="right" overlayClassName="ant-menu-inline-collapsed-tooltip" transitionName="zoom-big-fast" mouseEnterDelay={0.1} mouseLeaveDelay={0.1} arrowPointAtCenter={false} autoAdjustOverflow={true} prefixCls="ant-tooltip" getTooltipContainer={[undefined]} builtinPlacements={{...}} overlay="" onVisibleChange={[Function: onVisibleChange]} onPopupAlign={[Function: onPopupAlign]} overlayInnerStyle={[undefined]} arrowContent={{...}}>
                              <Trigger popupClassName="ant-menu-inline-collapsed-tooltip" prefixCls="ant-tooltip" popup={[Function: getPopupElement]} action={{...}} builtinPlacements={{...}} popupPlacement="right" popupAlign={{...}} getPopupContainer={[undefined]} onPopupVisibleChange={[Function: onVisibleChange]} afterPopupVisibleChange={[Function: noop]} popupTransitionName="zoom-big-fast" popupAnimation={[undefined]} defaultPopupVisible={false} destroyPopupOnHide={false} autoDestroy={false} mouseLeaveDelay={0.1} popupStyle={{...}} mouseEnterDelay={0.1} title={{...}} visible={false} arrowPointAtCenter={false} autoAdjustOverflow={true} overlay="" onPopupAlign={[Function: onPopupAlign]} arrowContent={{...}} popupVisible={false} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} focusDelay={0} blurDelay={0.15} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}}>
                                <Connect(MenuItem) mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={7} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="About" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <MenuItem mode="horizontal" level={1} inlineIndent={24} renderMenuItem={[Function]} rootPrefixCls="ant-menu" index={7} parentMenu={{...}} manualRef={[Function: chainedFunction]} eventKey="About" active={false} multiple={[undefined]} onClick={[Function: onClick]} onItemHover={[Function]} motion={{...}} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} forceSubMenuRender={[undefined]} onOpenChange={[Function]} onDeselect={[Function]} onSelect={[Function]} builtinPlacements={{...}} itemIcon={[undefined]} expandIcon={[undefined]} openKeys={{...}} selectedKeys={{...}} triggerSubMenuAction="hover" subMenuKey="0-menu-" direction={[undefined]} className="ant-menu-item-only-child" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} isSelected={false} store={{...}}>
                                    <li onClick={[Function]} className="ant-menu-item ant-menu-item-only-child" onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onMouseEnter={[Function]} onMouseLeave={[Function]} onFocus={[undefined]} onBlur={[undefined]} title={[undefined]} role="menuitem" aria-disabled={[undefined]} style={{...}}>
                                      About
                                    </li>
                                  </MenuItem>
                                </Connect(MenuItem)>
                              </Trigger>
                            </ForwardRef(Tooltip)>
                          </Tooltip>
                        </MenuItem>
                        <Connect(SubMenu) title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="About-overflowed-indicator-placeholder" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}}>
                          <SubMenu title={{...}} className="ant-menu-overflowed-submenu" popupClassName="ant-menu-light" selectedKeys={{...}} openKeys={{...}} mode="horizontal" onSelect={[Function]} onDeselect={[Function]} subMenuOpenDelay={0.1} subMenuCloseDelay={0.1} triggerSubMenuAction="hover" level={1} onOpenChange={[Function]} inlineIndent={24} parentMenu={{...}} rootPrefixCls="ant-menu" eventKey="About-overflowed-indicator-placeholder" active={false} onItemHover={[Function]} renderMenuItem={[Function]} subMenuKey="0-menu-" disabled={false} index={0} builtinPlacements={{...}} motion={{...}} style={{...}} isOpen={false} store={{...}} onMouseEnter={[Function: noop]} onMouseLeave={[Function: noop]} onTitleMouseEnter={[Function: noop]} onTitleMouseLeave={[Function: noop]} onTitleClick={[Function: noop]} manualRef={[Function: noop]}>
                            <li className="ant-menu-submenu ant-menu-submenu-horizontal ant-menu-overflowed-submenu" style={{...}} onMouseEnter={[Function]} onMouseLeave={[Function]} role="menuitem">
                              <Trigger prefixCls="ant-menu-submenu" popupClassName="ant-menu-submenu-popup ant-menu-light" getPopupContainer={[undefined]} builtinPlacements={{...}} popupPlacement="bottomLeft" popupVisible={false} popupAlign={{...}} popup={{...}} action={{...}} mouseEnterDelay={0.1} mouseLeaveDelay={0.1} onPopupVisibleChange={[Function]} forceRender={[undefined]} getPopupClassNameFromAlign={[Function: returnEmptyString]} getDocument={[Function: returnDocument]} afterPopupVisibleChange={[Function: noop]} onPopupAlign={[Function: noop]} focusDelay={0} blurDelay={0.15} popupStyle={{...}} destroyPopupOnHide={false} defaultPopupVisible={false} mask={false} maskClosable={true} showAction={{...}} hideAction={{...}} autoDestroy={false}>
                                <div style={{...}} className="ant-menu-submenu-title" role="button" onMouseEnter={[Function]} onMouseLeave={[Function]} onClick={[Function]} aria-expanded={false} aria-haspopup="true" title={[undefined]} onContextMenu={[undefined]} onMouseDown={[undefined]} onTouchStart={[undefined]} onFocus={[undefined]} onBlur={[undefined]}>
                                  <span>
                                    ···
                                  </span>
                                  <i className="ant-menu-submenu-arrow" />
                                </div>
                              </Trigger>
                            </li>
                          </SubMenu>
                        </Connect(SubMenu)>
                      </ul>
                    </DOMWrap>
                  </SubPopupMenu>
                </Connect(SubPopupMenu)>
              </Provider>
            </Menu>
          </InternalMenu>
        </Menu>
      </div>
    </HeaderView>

ljharb · 2020-06-21T21:43:07Z

render is just "ReactDOM.renderToString" and then that's dumped into cheerio; it's not worth thinking about here.

it's a particularly large tree, but that's not even that large of debug output. Whatever you're using to generate snapshots is probably the cause of the issue. That said, enzyme does not endorse or recommend snapshot tests, since they're a highly brittle form of test.

rogerprz · 2021-12-02T21:55:42Z

I'm getting the same or similar error. Using shallow and render does generate logable data.

PrettyFormatPluginError: Invalid string lengthRangeError: Invalid string length

       at printObjectProperties (../../node_modules/pretty-format/build/collections.js:172:47)
       at printComplexValue (../../node_modules/pretty-format/build/index.js:295:48)
       at printer (../../node_modules/pretty-format/build/index.js:378:10)
       at printObjectProperties (../../node_modules/pretty-format/build/collections.js:171:21)
       at printComplexValue (../../node_modules/pretty-format/build/index.js:295:48)
       at printer (../../node_modules/pretty-format/build/index.js:378:10)

When I use shallow I can use .debug() and props()

console.log
  DDD: <StyledCoreDataGridBase listConfig={{...}} data={{...}} isLoading={false} />
  at Object.<anonymous> (src/DataGrid/__tests__/CoreDataGrid.test.tsx:175:17)
console.log
  CCC: {
    listConfig: [
      {
        key: 'id',
        name: 'test',
        fieldName: 'id',
        type: 'number',
        minColumnWidth: 50
      },
      {
        key: 'name',
        name: 'test',
        fieldName: 'Name',
        type: 'string',
        minColumnWidth: 50
      },
      {
        key: 'score',
        name: 'Score',
        fieldName: 'Score',
        type: 'string',
        minColumnWidth: 50
      },
      {
        key: 'date',
        name: 'Date',
        fieldName: 'Date',
        type: 'moment',
        minColumnWidth: 50
      },
      {
        key: 'link',
        name: 'Link',
        type: 'link',
        url: 'url',
        minColumnWidth: 50
      }
    ],
    data: [
      { id: '1', Name: 'test', Score: 25, Date: [M], url: 'url1' },
      { id: '2', Name: 'test2', Score: 50, Date: [M], url: 'url2' },
      { id: '3', Name: 'test3', Score: 25, Date: [M], url: 'url3' }
    ],
    isLoading: false
  }

Code:

const component = mount(
            <CoreDataGrid 
                listConfig={columns} 
                data={data} 
                isLoading={false} 
                />
            );
        expect(component).toMatchSnapshot();

[x] enzyme-adapter-16

ljharb added the Need More Information label Jun 20, 2020

20BBrown14 mentioned this issue Jun 20, 2020

JavaScript heap out of memory after upgrade to Jest 26 jestjs/jest#9980

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Using mount() causes out-of-memory errors #2405

Using mount() causes out-of-memory errors #2405

20BBrown14 commented Jun 20, 2020 •

edited

Loading

ljharb commented Jun 20, 2020

ljharb commented Jun 20, 2020

20BBrown14 commented Jun 20, 2020 •

edited

Loading

ljharb commented Jun 21, 2020

rogerprz commented Dec 2, 2021

Using mount() causes out-of-memory errors #2405

Using mount() causes out-of-memory errors #2405

Comments

20BBrown14 commented Jun 20, 2020 • edited Loading

Current behavior

Expected behavior

Your environment

API

Version

Adapter

ljharb commented Jun 20, 2020

ljharb commented Jun 20, 2020

20BBrown14 commented Jun 20, 2020 • edited Loading

ljharb commented Jun 21, 2020

rogerprz commented Dec 2, 2021

20BBrown14 commented Jun 20, 2020 •

edited

Loading

20BBrown14 commented Jun 20, 2020 •

edited

Loading