Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

274
Views
Window.innerWidth gives wrong width value in react

I have no idea why I am getting the wrong value for window.innerWidth. Below is my code and the code after the isMobile check is important to run.

import CmsBlock from '@magento/venia-ui/lib/components/CmsBlock';
import { useWindowSize } from '@magento/peregrine/lib/hooks/useWindowSize';

 const isMobile = useWindowSize().innerWidth < 1024;
    const footer = <CmsBlock identifiers="footer" />;
    const handlers = useRef(null);

    const handleTabClick = useCallback((element) => {
        element.classList.toggle('active-tab');
    }, []);

    useEffect(() => {
        if (handlers.current) {
            for (const {element, handler} of handlers.current) {
                element.removeEventListener("click", handler);
            }
            handlers.current = null;
        }

        const buttonElements = document.querySelectorAll('.col-links');
        console.log(isMobile, window.innerWidth)
        if (isMobile) {
            handlers.current = [];
            for (const element of buttonElements) {
                const handler = handleTabClick.bind(null, element);
                handlers.current.push({ element, handler });
                element.addEventListener("click", handler);
            }
        } else {
            for (const element of buttonElements) {
                element.classList.remove('active-tab');
            }
        }

    }, [isMobile, footer, handleTabClick]);
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!