@salla.sa/twilight-components
Version:
Salla Web Component
43 lines (42 loc) • 2.2 kB
JavaScript
/*!
* Crafted with ❤ by Salla
*/
import { newE2EPage } from "@stencil/core/testing";
describe('salla-progress-bar', () => {
it('renders', async () => {
const page = await newE2EPage();
await page.setContent('<salla-progress-bar></salla-progress-bar>');
const element = await page.find('salla-progress-bar');
expect(element).not.toBeNull();
});
describe("Testing Props", () => {
let page;
let element;
it("should render the element", async () => {
page = await newE2EPage({
html: `
<salla-progress-bar target="7500" value="1500" currency="USD"></salla-progress-bar>
`,
});
element = await page.find('salla-progress-bar');
expect(element.innerHTML).toBe(`<div class="s-progress-bar-container"><div class="s-progress-bar-target-section"><span>1500 </span><span>7500 </span></div><div class="s-progress-bar-wrapper" style="height: 10px;"><div class="s-progress-bar-progress" style="width: 20%;"></div></div></div>`);
});
it("Should render header along with message", async () => {
page = await newE2EPage({
html: `<salla-progress-bar class="grow" target="7500" value="1500"
message="This is the subtitle of the progress bar" currency="USD" header="Title" stripped height="15px"></salla-progress-bar>`
});
element = await page.find(`salla-progress-bar`);
expect(element.innerHTML).toBe(`<div class="s-progress-bar-container"><div class="s-progress-bar-header">Title</div><div class="s-progress-bar-target-section"><span>1500 </span><span>7500 </span></div><div class="s-progress-bar-wrapper" style="height: 15px;"><div class="s-progress-bar-progress s-progress-bar-progress-stripped" style="width: 20%;"></div></div><span class="s-progress-bar-message">This is the subtitle of the progress bar</span></div>`);
});
it("should work for `target` prop", async () => {
const page = await newE2EPage();
await page.setContent(`<salla-progress-bar></salla-progress-bar>`);
await page.$eval("salla-progress-bar", elm => {
elm.target = 1234;
});
await page.waitForChanges();
});
});
});
//# sourceMappingURL=salla-progress-bar.e2e.js.map