@upendradevsingh/webcore/src/Popover/popover.test.js

UI Core Components for web

import React from 'react';
import { expect } from 'chai';
import { render, shallow } from 'enzyme';

import Popover from './Popover'

describe('<Popover />', () => {
    it('render children when passed in', () => {
        const wrapper = render(
            <Popover>
                <p class="text"> I am popover </p>
                <p class="text"> I am popover </p>
            </Popover>
        );
        expect(wrapper.find('.text')).to.have.length(2);
    });

    it('creates popover content block', () => {
        const wrapper = render(
            <Popover 
                    targetClass="btn"
                    inline={true}
                    placement={"right"}
                    targetText="I am Popover - Right">
                        <p> I am Popover Content </p>
                        <p> I am Popover Content </p>
                        <p> I am Popover Content </p>
                </Popover>
        );

        // Rendered html of Popover component
        expect(wrapper.html().trim()).to.equal(
            `<div class="popover-options" style="position:relative;display:inline-block;"><div class="popover fade right in" role="tooltip" style="display:block;left:-9999px;top:0;opacity:0;"><div class="arrow" style="left:-11px;"></div><h3 class="popover-title hide"></h3><div class="popover-content"><p> I am Popover Content </p><p> I am Popover Content </p><p> I am Popover Content </p></div></div><span class="popover-btn btn">I am Popover - Right</span></div>`
        );
    })
});