Demo: https://dvyogesh.github.io/lerna-starter/?path=/story/design-system-window-handle--window-handle
will helps to solve handle window undefined Error window undefined or undefined of window . This error mostly comes in node js application at the time when you are trying to run browser object in server side.
`handle-window-undefined` is a powerful and lightweight, flexible ES6 JavaScript library
Features
- Server side rendering
- light waight
Install
$ npm install handle-window-undefined --save
$ yarn add handle-window-undefined
Usage
Just import the window
component from handle-window-undefined
import window from 'handle-window-undefined';
// we can access any function related to window object
// like window.addEventListener, window.matchMedia, window.location ...etc
console.log(window)
-- OR --
Simple DOM Example
Just import the GridCarousel
component from handle-window-undefined
and pass your item as childrens
import window from 'handle-window-undefined';
window.document.body.innerHTML = '<div class="foo">Hi!</div>';
window.document.body.querySelector('.foo').textContent;
Another Example with react
in this way we can avoid window undefined error while add window.addEventListener
import React,{useEffect} from 'react';
import window from 'handle-window-undefined';
const WindowExample = () => {
useEffect(()=>{
window.addEventListener('click', ()=>{})
})
}
export default WindowExample;
or visit https://dvyogesh.github.io/lerna-starter/?path=/story/design-system-window-handle--window-handle
Universal Testing Pattern
You can use a really simple pattern to enable your browser modules to run in Node.js. Just allow a window object to be passed in to your module and prepend any references to browser globals with win. Set win to the passed in window object if it exists, otherwise fallback to global window.
import window from 'handle-window-undefined'
function createTitle(text, win) {
win = win || (typeof window === 'undefined' ? undefined : window);
const title = win.document.createElement('h1');
title.innerHTML = text;
return title;
};
module.exports = createTitle;
or visit https://dvyogesh.github.io/lerna-starter/?path=/story/design-system-window-handle--window-handle
LICENSE
MIT