@nyaruka/temba-components 0.42.1 → 0.43.0

package/test/temba-contact-history.test.ts

@@ -80,7 +80,7 @@ describe('temba-contact-history', () => {
 
     const events = history.shadowRoot.querySelector('.events');
     const top = events.scrollHeight - events.getBoundingClientRect().height;
-    expect(top).to.equal(549);
+    expect(top).to.equal(565);
     // make sure we actually scrolled to there
     expect(events.scrollTop).to.equal(top);
     await assertScreenshot('contacts/history', getHistoryClip(history));

package/test/temba-lightbox.test.ts

@@ -0,0 +1,35 @@
+import { fixture, assert } from '@open-wc/testing';
+import { Lightbox } from '../src/lightbox/Lightbox';
+import { assertScreenshot } from './utils.test';
+
+export const getHTML = () => {
+  return `<temba-lightbox animationTime="0"></temba-lightbox>`;
+};
+
+// let clock: any;
+
+describe('temba-lightbox', () => {
+  it('can be created', async () => {
+    const lightbox: Lightbox = await fixture(getHTML());
+    const img = await fixture(
+      "<img style='width:100px;height:auto' src='./test-assets/img/meow.jpg'/>"
+    );
+
+    await assertScreenshot('lightbox/img', {
+      x: 28,
+      y: 28,
+      width: 1024,
+      height: 768,
+    });
+
+    assert.instanceOf(lightbox, Lightbox);
+    lightbox.showElement(img as HTMLElement);
+
+    await assertScreenshot('lightbox/img-zoomed', {
+      x: 28,
+      y: 28,
+      width: 1024,
+      height: 768,
+    });
+  });
+});

package/test/utils.test.ts

@@ -55,8 +55,7 @@ export const getComponent = async (
     ${style ? style : ``}
   `;
   parentNode.setAttribute('style', styleAttribute);
-  const component = await fixture(spec, { parentNode });
-  return component;
+  return await fixture(spec, { parentNode });
 };
 
 const createResponse = mocked => {

package/test-assets/style.css

@@ -143,6 +143,7 @@ html {
   --button-x: 14px;
 
   --menu-padding: 1em;
+  --color-automated: rgb(78,205,106);
 }
 
 temba-button {

package/web-test-runner.config.mjs

@@ -195,6 +195,10 @@ const wireScreenshots = async (page, context, wait) => {
     }
   );
 
+  await page.exposeFunction('waitForNetworkIdle', async () =>{
+    await page.waitForNetworkIdle();
+  });
+  
   await page.exposeFunction('setViewport', async options => {
     await page.setViewport(options);
   });