import { expect, tap } from '@git.zone/tstest/tapbundle';

import * as socialioCatalog from '../ts_web/index.js';

tap.test('render combox component', async () => {
  // Create and add combox
  const combox = new socialioCatalog.SioCombox();
  combox.style.position = 'relative';
  combox.style.width = '800px';
  combox.style.height = '600px';
  document.body.appendChild(combox);
  
  await combox.updateComplete;
  
  expect(combox).toBeInstanceOf(socialioCatalog.SioCombox);
  
  // Check that the component rendered its content
  const container = combox.shadowRoot.querySelector('.container');
  expect(container).toBeTruthy();
  
  const conversationSelector = combox.shadowRoot.querySelector('sio-conversation-selector');
  expect(conversationSelector).toBeTruthy();
  
  const conversationView = combox.shadowRoot.querySelector('sio-conversation-view');
  expect(conversationView).toBeTruthy();
  
  console.log('Combox component rendered successfully with all main elements');
  
  document.body.removeChild(combox);
});

tap.test('render fab component', async () => {
  // Create and add fab
  const fab = new socialioCatalog.SioFab();
  document.body.appendChild(fab);
  
  await fab.updateComplete;
  expect(fab).toBeInstanceOf(socialioCatalog.SioFab);
  
  // Check main elements
  const mainbox = fab.shadowRoot.querySelector('#mainbox');
  expect(mainbox).toBeTruthy();
  
  console.log('FAB component rendered successfully');
  
  document.body.removeChild(fab);
});

tap.start();