Add a spec for ResultViewComponent

[hpierce1102]

#813

This adds a basic test for ResultViewComponent. I was hoping to get farther and write more useful tests, but ran into issues with mocking some internals of the class.

For instance, I wanted to demonstrate the clicking on the topmost <div> actually ran openInEditor, but struggled to mock openInEditor. I also wanted to demonstrate that clicking icon-clippy actually copied stuff to the clipboard, but figuring out how to make that actually button appear for a test was outside of my React skills (I got to a point where it looked like it had something to do withref = { ref => {]}) 😕.

I'd be more than happy if someone had some advice to offer in terms of adding more value to these tests. Or if someone thinks this is useful enough to merge without more tests - I suppose that'd be fine too.

[lgeiger]

Thanks a lot for contributing! We really appreciate your help to improve test coverage 🎉

I added a few suggestions, that would simplify the code.

I also wanted to demonstrate that clicking icon-clippy actually copied stuff to the clipboard, but figuring out how to make that actually button appear for a test was outside of my React skills.

Just guessing from the the code, I would say the button is not rendered because there's no text to be copied in the output. I'd be happy to take a closer look later this week.

[lgeiger]

This could be simplified using jasmine spies:

const destroy = jasmine.createSpy("destroy");
const component = shallow(
  <ResultViewComponent
    store={mockStore}
    kernel={{}}
    destroy={destroy}
    showResult={true}
  />
);

component.find(".icon-x").simulate("click");
expect(destroy).toHaveBeenCalled();

[BenRussert]

@hpierce1102 did you want to take a crack at using Jasmine spies here?

[hpierce1102]

Sorry for the radio silence. Yes, I'd like to look at it again and dive in Jasmine spies.

[lgeiger]

Side note: It would be great to be able to use jest snapshots for this kind of component testing. It would make things a lot easier for sure.

[BenRussert]

Just guessing from the the code, I would say the button is not rendered because there's no text to be copied in the output.

This is correct. Here is the relevant line. Basically this.getAllText().length > 0 checks to see if there is any text to copy, there won't be any text to copy if the output is an image, for example.

[BenRussert]

Thanks for putting this together! I know you had some more goals you mentioned above, but I think it makes sense to merge now and please feel free to send over more PRs if you keep working on that (or anything else 😀)

Welcome to the nteract party!