buttonFunctionality.html
<template>
<lightning-button label="submit" onclick={handleClick}></lightning-button>
<template if:true={isActive}>
<div class="ifBlock">
Yes I am in if block
</div>
</template>
<template if:false={isActive}>
<div class="elseBlock">
Yes I am in else block
</div>
</template>
</template>
buttonFunctionality.js
import { LightningElement,track } from 'lwc';
export default class ButtonFunctionality extends LightningElement {
@track isActive=false;
handleClick(){
this.isActive=true;
}
}
buttonFunctionality.test.js
import {createElement} from 'lwc';
import ButtonFunctionality from 'c/buttonFunctionality';
describe('c-button-functionality',()=>{
beforeEach(()=>{
const element = createElement('c-button-functionality', {
is: DemoTest
})
document.body.appendChild(element)
})
test('testing else block',()=>{
const element=document.querySelector('c-button-functionality');
const divElseText=element.shadowRoot.querySelector('div.elseBlock');
expect(divElseText.textContent).toBe('Yes I am in else block');
});
test('testing if block',()=>{
const element=document.querySelector('c-button-functionality');
const inputButton=element.shadowRoot.querySelector('lightning-button');
inputButton.dispatchEvent(new CustomEvent('click'));
return Promise.resolve().then(()=>{
const text=element.shadowRoot.querySelector('div.ifBlock');
expect(text.textContent).toBe('Yes I am in if block');
});
});
})
