import { expect, tap } from '@git.zone/tstest/tapbundle';
import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu.js';
import { demoFunc } from '../ts_web/elements/dees-contextmenu.demo.js';

tap.test('should render context menu demo', async () => {
  // Create demo container
  const demoContainer = document.createElement('div');
  document.body.appendChild(demoContainer);
  
  // Render the demo
  const demoContent = demoFunc();
  
  // Create a temporary element to hold the rendered template
  const tempDiv = document.createElement('div');
  tempDiv.innerHTML = demoContent.strings.join('');
  
  // Check that panels are rendered
  const panels = tempDiv.querySelectorAll('dees-panel');
  expect(panels.length).toEqual(4);
  
  // Check panel headings
  expect(panels[0].getAttribute('heading')).toEqual('Basic Context Menu with Nested Submenus');
  expect(panels[1].getAttribute('heading')).toEqual('Component-Specific Context Menu');
  expect(panels[2].getAttribute('heading')).toEqual('Advanced Context Menu Example');
  expect(panels[3].getAttribute('heading')).toEqual('Static Context Menu (Always Visible)');
  
  // Check that static context menu exists
  const staticMenu = tempDiv.querySelector('dees-contextmenu');
  expect(staticMenu).toBeTruthy();
  
  // Clean up
  demoContainer.remove();
});

export default tap.start();