[GitHub] [echarts] lougroshek commented on issue #10478: "Can't get dom width or height" incorrectly fires for width/height values of 0.

[GitBox <gi...@apache.org>]

lougroshek commented on issue #10478:
URL: https://github.com/apache/echarts/issues/10478#issuecomment-907204865


   I'm seeing this during jest testing and am providing parent width and height (and have also attempted to set window innerHeight and innerWidth in various ways). Just a warning, but would love if we could resolve somehow. 
   
   ```
    console.warn
       Can't get DOM width or height. Please check dom.clientWidth and dom.clientHeight. They should not be 0.For example, you may need to call this in the callback of window.onload.
   
         at Object.init$1 [as init] (node_modules/echarts/lib/core/echarts.js:2226:15)
         at EChartsReact.Object.<anonymous>.EChartsReactCore.getEchartsInstance (node_modules/echarts-for-react/src/core.tsx:89:68)
         at EChartsReact.Object.<anonymous>.EChartsReactCore.updateEChartsOption (node_modules/echarts-for-react/src/core.tsx:160:33)
         at EChartsReact.Object.<anonymous>.EChartsReactCore.renderNewEcharts (node_modules/echarts-for-react/src/core.tsx:114:34)
         at EChartsReact.Object.<anonymous>.EChartsReactCore.componentDidMount (node_modules/echarts-for-react/src/core.tsx:31:10)
         at commitLifeCycles (node_modules/react-dom/cjs/react-dom.development.js:20663:24)
         at commitLayoutEffects (node_modules/react-dom/cjs/react-dom.development.js:23426:7)
   ```
   
   ```
   test('Renders scatter plot ReportWidget', () => {
     window.innerWidth = 1200
     window.innerHeight = 800
     render(
       <ApolloWrapper>
         <Router>
           <ThemeProvider theme={theme}>
             <div style={{ width: '600px', height: '400px' }}>
               <ReportWidget report="scatter" />
             </div>
           </ThemeProvider>
         </Router>
       </ApolloWrapper>
     )
   })
   ```
   
   Have also tried other ways of setting window size before the test, both in `beforeEach()` and in the test itself: 
   
   ```
   # Global provided by jest
   global.innerHeight = 800
     global.innerWidth = 1200
   # Object.defineProperty
     Object.defineProperty(window, 'innerWidth', {
       writable: true,
       configurable: true,
       value: 1200,
     })
     Object.defineProperty(window, 'innerHeight', {
       writable: true,
       configurable: true,
       value: 800,
     })
   ```
   
   echarts 5.1.2
   echarts-for-react 3.0.1
   jest-dom 5.14.1


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org