Styjun

Add big quotation marks inside my colorbox

Why did the EU agree to delay the Brexit deadline?

Does IPv6 have similar concept of network mask?

15% tax on $7.5k earnings. Is that right?

Did arcade monitors have same pixel aspect ratio as TV sets?

Recommended PCB layout understanding - ADM2572 datasheet

A binary search solution to 3Sum

Does the UK parliament need to pass secondary legislation to accept the Article 50 extension

putting logo on same line but after title, latex

Probability that THHT occurs in a sequence of 10 coin tosses

How do I delete all blank lines in a buffer?

Is there a way to get `mathscr' with lower case letters in pdfLaTeX?

PTIJ: Haman's bad computer

Can I say "fingers" when referring to toes?

What does "Scientists rise up against statistical significance" mean? (Comment in Nature)

How do you respond to a colleague from another team when they're wrongly expecting that you'll help them?

Solve the following system of equations - (3)

Can disgust be a key component of horror?

Redundant comparison & "if" before assignment

Can a stoichiometric mixture of oxygen and methane exist as a liquid at standard pressure and some (low) temperature?

System.QueryException unexpected token

Does an advisor owe his/her student anything? Will an advisor keep a PhD student only out of pity?

When were female captains banned from Starfleet?

How do you make your own symbol when Detexify fails?

How to test a method dispatching custom event

How do JavaScript closures work?How do I check if an element is hidden in jQuery?How to change an element's class with JavaScript?How do I remove a property from a JavaScript object?How do I redirect to another webpage?How do I test for an empty JavaScript object?How to check whether a checkbox is checked in jQuery?How do I include a JavaScript file in another JavaScript file?How to check whether a string contains a substring in JavaScript?How do I remove a particular element from an array in JavaScript?

0

I have a static method that creates a custom event and dispatches it:

 class MyComponent extends 
 static refreshComponent() 
 const event = new Event('refreshComponent');
 document.dispatchEvent(event);
 
 render() 
 MyComponent.refreshComponent();
 
 

I am trying test as below:

describe('refreshComponent', () => 
 it('should dispatch an event', () => 
 const document = dispatchEvent: jest.fn() ;
 wrapper.refreshGoalsComponent();
 expect(document.dispatchEvent).toHaveBeenCalledWith('refreshComponent');
 );
 );

But the dispatchEvent is not called here, as there is no mock for 'new Event()'. Is there a way to mock it? Please help

javascript reactjs dom enzyme jest

share|improve this question

edited yesterday

Benison

asked yesterday

BenisonBenison

126

add a comment | 

0

I have a static method that creates a custom event and dispatches it:

 class MyComponent extends 
 static refreshComponent() 
 const event = new Event('refreshComponent');
 document.dispatchEvent(event);
 
 render() 
 MyComponent.refreshComponent();
 
 

I am trying test as below:

describe('refreshComponent', () => 
 it('should dispatch an event', () => 
 const document = dispatchEvent: jest.fn() ;
 wrapper.refreshGoalsComponent();
 expect(document.dispatchEvent).toHaveBeenCalledWith('refreshComponent');
 );
 );

But the dispatchEvent is not called here, as there is no mock for 'new Event()'. Is there a way to mock it? Please help

javascript reactjs dom enzyme jest

share|improve this question

edited yesterday

Benison

asked yesterday

BenisonBenison

126

add a comment | 

I have a static method that creates a custom event and dispatches it:

 class MyComponent extends 
 static refreshComponent() 
 const event = new Event('refreshComponent');
 document.dispatchEvent(event);
 
 render() 
 MyComponent.refreshComponent();
 
 

I am trying test as below:

describe('refreshComponent', () => 
 it('should dispatch an event', () => 
 const document = dispatchEvent: jest.fn() ;
 wrapper.refreshGoalsComponent();
 expect(document.dispatchEvent).toHaveBeenCalledWith('refreshComponent');
 );
 );

But the dispatchEvent is not called here, as there is no mock for 'new Event()'. Is there a way to mock it? Please help

javascript reactjs dom enzyme jest

share|improve this question

edited yesterday

Benison

asked yesterday

BenisonBenison

126

 class MyComponent extends 
 static refreshComponent() 
 const event = new Event('refreshComponent');
 document.dispatchEvent(event);
 
 render() 
 MyComponent.refreshComponent();
 
 

describe('refreshComponent', () => 
 it('should dispatch an event', () => 
 const document = dispatchEvent: jest.fn() ;
 wrapper.refreshGoalsComponent();
 expect(document.dispatchEvent).toHaveBeenCalledWith('refreshComponent');
 );
 );

share|improve this question

edited yesterday

Benison

asked yesterday

BenisonBenison

126

share|improve this question

edited yesterday

Benison

asked yesterday

BenisonBenison

126

asked yesterday

BenisonBenison

126

asked yesterday

BenisonBenison

126

1 Answer
1

active

oldest

votes

0

You can mock globals with Jest:

describe('your test', () => 
 let EventBak
 let documentBak

 beforeAll(() => 
 EventBak = global.Event
 documentBak = global.document
 global.Event = jest.fn()
 global.document = 
 ...global.document,
 dispatchEvent: jest.fn()
 
 )

 afterAll(() => 
 global.Event = EventBak
 global.document = documentBak
 )

 it('...', () => 
 ...
 expect(global.document.dispatchEvent).toHaveBeenCalled()
 )
)

share|improve this answer

edited yesterday

answered yesterday

lipplipp

2,7081821

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Jest now complaining for the dispatchEvent to be mocked: expect(jest.fn())[.not].toHaveBeenCalledWith() jest.fn() value must be a mock function or spy. Received: function: [Function dispatchEvent]
  
  – Benison
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  is this working now?
  
  – lipp
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  No, still the same error mentioned above :(
  
  – Benison
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Do we need JSDOM API to mock document?
  
  – Benison
  yesterday
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Depends on your jest setup
  
  – lipp
  yesterday
  

  
  
  
  

 | 
show 2 more comments

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55280573%2fhow-to-test-a-method-dispatching-custom-event%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

You can mock globals with Jest:

describe('your test', () => 
 let EventBak
 let documentBak

 beforeAll(() => 
 EventBak = global.Event
 documentBak = global.document
 global.Event = jest.fn()
 global.document = 
 ...global.document,
 dispatchEvent: jest.fn()
 
 )

 afterAll(() => 
 global.Event = EventBak
 global.document = documentBak
 )

 it('...', () => 
 ...
 expect(global.document.dispatchEvent).toHaveBeenCalled()
 )
)

share|improve this answer

edited yesterday

answered yesterday

lipplipp

2,7081821

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Jest now complaining for the dispatchEvent to be mocked: expect(jest.fn())[.not].toHaveBeenCalledWith() jest.fn() value must be a mock function or spy. Received: function: [Function dispatchEvent]
  
  – Benison
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  is this working now?
  
  – lipp
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  No, still the same error mentioned above :(
  
  – Benison
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Do we need JSDOM API to mock document?
  
  – Benison
  yesterday
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Depends on your jest setup
  
  – lipp
  yesterday
  

  
  
  
  

 | 
show 2 more comments

0

You can mock globals with Jest:

describe('your test', () => 
 let EventBak
 let documentBak

 beforeAll(() => 
 EventBak = global.Event
 documentBak = global.document
 global.Event = jest.fn()
 global.document = 
 ...global.document,
 dispatchEvent: jest.fn()
 
 )

 afterAll(() => 
 global.Event = EventBak
 global.document = documentBak
 )

 it('...', () => 
 ...
 expect(global.document.dispatchEvent).toHaveBeenCalled()
 )
)

share|improve this answer

edited yesterday

answered yesterday

lipplipp

2,7081821

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Jest now complaining for the dispatchEvent to be mocked: expect(jest.fn())[.not].toHaveBeenCalledWith() jest.fn() value must be a mock function or spy. Received: function: [Function dispatchEvent]
  
  – Benison
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  is this working now?
  
  – lipp
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  No, still the same error mentioned above :(
  
  – Benison
  yesterday
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Do we need JSDOM API to mock document?
  
  – Benison
  yesterday
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Depends on your jest setup
  
  – lipp
  yesterday
  

  
  
  
  

 | 
show 2 more comments

You can mock globals with Jest:

describe('your test', () => 
 let EventBak
 let documentBak

 beforeAll(() => 
 EventBak = global.Event
 documentBak = global.document
 global.Event = jest.fn()
 global.document = 
 ...global.document,
 dispatchEvent: jest.fn()
 
 )

 afterAll(() => 
 global.Event = EventBak
 global.document = documentBak
 )

 it('...', () => 
 ...
 expect(global.document.dispatchEvent).toHaveBeenCalled()
 )
)

share|improve this answer

edited yesterday

answered yesterday

lipplipp

2,7081821

describe('your test', () => 
 let EventBak
 let documentBak

 beforeAll(() => 
 EventBak = global.Event
 documentBak = global.document
 global.Event = jest.fn()
 global.document = 
 ...global.document,
 dispatchEvent: jest.fn()
 
 )

 afterAll(() => 
 global.Event = EventBak
 global.document = documentBak
 )

 it('...', () => 
 ...
 expect(global.document.dispatchEvent).toHaveBeenCalled()
 )
)

share|improve this answer

edited yesterday

answered yesterday

lipplipp

2,7081821

answered yesterday

lipplipp

2,7081821

answered yesterday

lipplipp

2,7081821