@afixt/test-utils 1.0.0

package/test/getStyleObject.test.js

@@ -0,0 +1,134 @@
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { getStyleObject } from '../src/getStyleObject.js';
+
+describe('getStyleObject', () => {
+  beforeEach(() => {
+    document.body.innerHTML = '';
+  });
+
+  it('should retrieve computed styles as an object with camelCased properties', () => {
+    // Arrange
+    const div = document.createElement('div');
+    div.style.color = 'red';
+    div.style.backgroundColor = 'blue';
+    div.style.fontSize = '16px';
+    document.body.appendChild(div);
+    
+    // Mock the getComputedStyle to return predictable values
+    const originalGetComputedStyle = window.getComputedStyle;
+    window.getComputedStyle = vi.fn().mockImplementation(() => {
+      const styleObj = {
+        length: 3,
+        0: 'color',
+        1: 'background-color',
+        2: 'font-size',
+        getPropertyValue: (prop) => {
+          if (prop === 'color') return 'rgb(255, 0, 0)';
+          if (prop === 'background-color') return 'rgb(0, 0, 255)';
+          if (prop === 'font-size') return '16px';
+          return '';
+        }
+      };
+      return styleObj;
+    });
+    
+    // Act
+    const result = getStyleObject(div);
+    
+    // Clean up
+    window.getComputedStyle = originalGetComputedStyle;
+    
+    // Assert
+    expect(result).toEqual({
+      color: 'rgb(255, 0, 0)',
+      backgroundColor: 'rgb(0, 0, 255)',
+      fontSize: '16px'
+    });
+  });
+
+  it('should return false if getComputedStyle is not available', () => {
+    // Arrange
+    const div = document.createElement('div');
+    
+    // Mock the absence of getComputedStyle
+    const originalGetComputedStyle = window.getComputedStyle;
+    window.getComputedStyle = undefined;
+    
+    // Act
+    const result = getStyleObject(div);
+    
+    // Clean up
+    window.getComputedStyle = originalGetComputedStyle;
+    
+    // Assert
+    expect(result).toBe(false);
+  });
+
+  it('should return false if style object is empty', () => {
+    // Arrange
+    const div = document.createElement('div');
+    
+    // Mock getComputedStyle to return an empty style object
+    const originalGetComputedStyle = window.getComputedStyle;
+    window.getComputedStyle = vi.fn().mockImplementation(() => {
+      return {
+        length: 0
+      };
+    });
+    
+    // Act
+    const result = getStyleObject(div);
+    
+    // Clean up
+    window.getComputedStyle = originalGetComputedStyle;
+    
+    // Assert
+    expect(result).toBe(false);
+  });
+
+  it('should convert hyphenated CSS properties to camelCase', () => {
+    // Arrange
+    const div = document.createElement('div');
+    div.style.marginTop = '10px';
+    div.style.borderLeftWidth = '2px';
+    document.body.appendChild(div);
+    
+    // Mock getComputedStyle with hyphenated properties
+    const originalGetComputedStyle = window.getComputedStyle;
+    window.getComputedStyle = vi.fn().mockImplementation(() => {
+      const styleObj = {
+        length: 2,
+        0: 'margin-top',
+        1: 'border-left-width',
+        getPropertyValue: (prop) => {
+          if (prop === 'margin-top') return '10px';
+          if (prop === 'border-left-width') return '2px';
+          return '';
+        }
+      };
+      return styleObj;
+    });
+    
+    // Act
+    const result = getStyleObject(div);
+    
+    // Clean up
+    window.getComputedStyle = originalGetComputedStyle;
+    
+    // Assert
+    expect(result).toEqual({
+      marginTop: '10px',
+      borderLeftWidth: '2px'
+    });
+  });
+  
+  it('should return false for invalid DOM elements', () => {
+    // Arrange - test with various invalid inputs
+    const nonElements = [null, undefined, {}, 123, 'string', []];
+    
+    // Act & Assert
+    nonElements.forEach(input => {
+      expect(getStyleObject(input)).toBe(false);
+    });
+  });
+});

package/test/hasAccessibleName.test.js

@@ -0,0 +1,59 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import hasAccessibleName from '../src/hasAccessibleName';
+
+describe('hasAccessibleName', () => {
+  // Setup before each test
+  beforeEach(() => {
+    document.body.innerHTML = '';
+  });
+
+  it('should return false for null or undefined elements', () => {
+    expect(hasAccessibleName(null)).toBe(false);
+    expect(hasAccessibleName(undefined)).toBe(false);
+  });
+
+  it('should return true when element has aria-label', () => {
+    const element = document.createElement('div');
+    element.setAttribute('aria-label', 'Test Label');
+    document.body.appendChild(element);
+    
+    expect(hasAccessibleName(element)).toBe(true);
+  });
+
+  it('should return true when element has aria-labelledby that references an existing element', () => {
+    const label = document.createElement('div');
+    label.id = 'test-label';
+    label.textContent = 'Test Label';
+    
+    const element = document.createElement('div');
+    element.setAttribute('aria-labelledby', 'test-label');
+    
+    document.body.appendChild(label);
+    document.body.appendChild(element);
+    
+    expect(hasAccessibleName(element)).toBe(true);
+  });
+
+  it('should return false when element has no accessible name', () => {
+    const element = document.createElement('div');
+    document.body.appendChild(element);
+    
+    expect(hasAccessibleName(element)).toBe(false);
+  });
+
+  it('should return true for img element with alt text', () => {
+    const element = document.createElement('img');
+    element.alt = 'Alt text description';
+    document.body.appendChild(element);
+    
+    expect(hasAccessibleName(element)).toBe(true);
+  });
+
+  it('should return true for button with text content', () => {
+    const element = document.createElement('button');
+    element.textContent = 'Click me';
+    document.body.appendChild(element);
+    
+    expect(hasAccessibleName(element)).toBe(true);
+  });
+});

package/test/hasAttribute.test.js

@@ -0,0 +1,132 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import { hasAttribute } from '../src/hasAttribute.js';
+
+describe('hasAttribute', () => {
+  beforeEach(() => {
+    document.body.innerHTML = '';
+  });
+
+  it('should return true when element has the specified attribute', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.setAttribute('data-test', 'value');
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasAttribute('data-test', element);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return false when element does not have the specified attribute', () => {
+    // Arrange
+    const element = document.createElement('div');
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasAttribute('data-test', element);
+    
+    // Assert
+    expect(result).toBe(false);
+  });
+  
+  it('should return true when attribute has empty string value', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.setAttribute('data-empty', '');
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasAttribute('data-empty', element);
+    
+    // Assert
+    expect(result).toBe(true); // Element has the attribute even if value is empty
+  });
+  
+  it('should return true for boolean attributes', () => {
+    // Arrange
+    const element = document.createElement('button');
+    element.setAttribute('disabled', '');
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasAttribute('disabled', element);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return false if element is null or undefined', () => {
+    // Act & Assert
+    expect(hasAttribute('data-test', null)).toBe(false);
+    expect(hasAttribute('data-test', undefined)).toBe(false);
+  });
+
+  it('should return false if element is not a DOM element', () => {
+    // Arrange
+    const notElements = [{}, [], 123, 'string', () => {}];
+    
+    // Act & Assert
+    notElements.forEach(item => {
+      expect(hasAttribute('data-test', item)).toBe(false);
+    });
+  });
+
+  it('should return false if attribute name is not a string', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.setAttribute('data-test', 'value');
+    document.body.appendChild(element);
+    
+    const invalidAttributes = [null, undefined, 123, {}, [], () => {}];
+    
+    // Act & Assert
+    invalidAttributes.forEach(attr => {
+      expect(hasAttribute(attr, element)).toBe(false);
+    });
+  });
+
+  it('should correctly identify attributes with various values', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.setAttribute('data-number', '123');
+    element.setAttribute('data-string', 'test');
+    element.setAttribute('data-boolean', 'true');
+    document.body.appendChild(element);
+    
+    // Act & Assert
+    expect(hasAttribute('data-number', element)).toBe(true);
+    expect(hasAttribute('data-string', element)).toBe(true);
+    expect(hasAttribute('data-boolean', element)).toBe(true);
+    expect(hasAttribute('data-nonexistent', element)).toBe(false);
+  });
+
+  it('should handle case-insensitive attribute names', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.setAttribute('data-test', 'value');
+    document.body.appendChild(element);
+    
+    // Act & Assert
+    expect(hasAttribute('data-test', element)).toBe(true);
+    expect(hasAttribute('DATA-TEST', element)).toBe(true); // Standard DOM hasAttribute is case-insensitive
+  });
+
+  it('should work with dynamically added and removed attributes', () => {
+    // Arrange
+    const element = document.createElement('div');
+    document.body.appendChild(element);
+    
+    // Act & Assert - Initially doesn't have the attribute
+    expect(hasAttribute('data-dynamic', element)).toBe(false);
+    
+    // Add attribute
+    element.setAttribute('data-dynamic', 'added');
+    expect(hasAttribute('data-dynamic', element)).toBe(true);
+    
+    // Remove attribute
+    element.removeAttribute('data-dynamic');
+    expect(hasAttribute('data-dynamic', element)).toBe(false);
+  });
+});

package/test/hasCSSGeneratedContent.test.js

@@ -0,0 +1,143 @@
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { hasCSSGeneratedContent } from '../src/hasCSSGeneratedContent.js';
+import * as generatedContentModule from '../src/getGeneratedContent.js';
+
+describe('hasCSSGeneratedContent', () => {
+  beforeEach(() => {
+    document.body.innerHTML = '';
+    // Remove any added stylesheets
+    const styleElements = document.querySelectorAll('style');
+    styleElements.forEach(style => style.remove());
+  });
+
+  // Helper function to create a stylesheet with CSS rules
+  const addStyleToDocument = (cssRules) => {
+    const styleElement = document.createElement('style');
+    styleElement.textContent = cssRules;
+    document.head.appendChild(styleElement);
+  };
+
+  it('should return true for elements with text content', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.textContent = 'Text content';
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return false for elements with no content', () => {
+    // Arrange
+    const element = document.createElement('div');
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(false);
+  });
+
+  it('should return false for null or undefined elements', () => {
+    // Act & Assert
+    expect(hasCSSGeneratedContent(null)).toBe(false);
+    expect(hasCSSGeneratedContent(undefined)).toBe(false);
+  });
+
+  it('should return true for elements with whitespace-only text content', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.textContent = '   ';
+    document.body.appendChild(element);
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  // The following tests rely on proper implementation of getGeneratedContent
+  // and may need to be run in a real browser environment for CSS pseudo-elements
+
+  it('should correctly identify elements with ::before content', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.id = 'with-before';
+    document.body.appendChild(element);
+    
+    // Mock getGeneratedContent to simulate browser behavior
+    const spy = vi.spyOn(generatedContentModule, 'getGeneratedContent');
+    spy.mockImplementation(() => 'Before content');
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(true);
+    
+    // Clean up
+    spy.mockRestore();
+  });
+
+  it('should correctly identify elements with ::after content', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.id = 'with-after';
+    document.body.appendChild(element);
+    
+    // Mock getGeneratedContent to simulate browser behavior
+    const spy = vi.spyOn(generatedContentModule, 'getGeneratedContent');
+    spy.mockImplementation(() => 'After content');
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(true);
+    
+    // Clean up
+    spy.mockRestore();
+  });
+
+  it('should return false when getGeneratedContent returns false', () => {
+    // Arrange
+    const element = document.createElement('div');
+    
+    // Mock getGeneratedContent to simulate no content
+    const spy = vi.spyOn(generatedContentModule, 'getGeneratedContent');
+    spy.mockImplementation(() => false);
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(false);
+    
+    // Clean up
+    spy.mockRestore();
+  });
+
+  it('should handle complex cases with mixed content', () => {
+    // Arrange
+    const element = document.createElement('div');
+    element.textContent = 'Text';
+    
+    // Mock getGeneratedContent to simulate mixed content
+    const spy = vi.spyOn(generatedContentModule, 'getGeneratedContent');
+    spy.mockImplementation(() => 'Before Text After');
+    
+    // Act
+    const result = hasCSSGeneratedContent(element);
+    
+    // Assert
+    expect(result).toBe(true);
+    
+    // Clean up
+    spy.mockRestore();
+  });
+});

package/test/hasHiddenParent.test.js

@@ -0,0 +1,176 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import hasHiddenParent from '../src/hasHiddenParent.js';
+
+describe('hasHiddenParent', () => {
+  beforeEach(() => {
+    document.body.innerHTML = '';
+  });
+
+  it('should return false for an element with no hidden parents', () => {
+    // Arrange
+    const grandparent = document.createElement('div');
+    const parent = document.createElement('div');
+    const child = document.createElement('div');
+    
+    grandparent.appendChild(parent);
+    parent.appendChild(child);
+    document.body.appendChild(grandparent);
+    
+    // Act
+    const result = hasHiddenParent(child);
+    
+    // Assert
+    expect(result).toBe(false);
+  });
+
+  it('should return true when immediate parent is hidden via display:none', () => {
+    // Arrange
+    const parent = document.createElement('div');
+    const child = document.createElement('div');
+    
+    parent.style.display = 'none'; // Set parent to be hidden
+    parent.appendChild(child);
+    document.body.appendChild(parent);
+    
+    // Act
+    const result = hasHiddenParent(child);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return true when immediate parent has hidden attribute', () => {
+    // Arrange
+    const parent = document.createElement('div');
+    const child = document.createElement('div');
+    
+    parent.setAttribute('hidden', ''); // Set parent to be hidden
+    parent.appendChild(child);
+    document.body.appendChild(parent);
+    
+    // Act
+    const result = hasHiddenParent(child);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return true when a grandparent is hidden', () => {
+    // Arrange
+    const grandparent = document.createElement('div');
+    const parent = document.createElement('div');
+    const child = document.createElement('div');
+    
+    grandparent.style.display = 'none'; // Set grandparent to be hidden
+    grandparent.appendChild(parent);
+    parent.appendChild(child);
+    document.body.appendChild(grandparent);
+    
+    // Act
+    const result = hasHiddenParent(child);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return true when great-grandparent is hidden', () => {
+    // Arrange
+    const greatGrandparent = document.createElement('div');
+    const grandparent = document.createElement('div');
+    const parent = document.createElement('div');
+    const child = document.createElement('div');
+    
+    greatGrandparent.style.display = 'none'; // Set great-grandparent to be hidden
+    greatGrandparent.appendChild(grandparent);
+    grandparent.appendChild(parent);
+    parent.appendChild(child);
+    document.body.appendChild(greatGrandparent);
+    
+    // Act
+    const result = hasHiddenParent(child);
+    
+    // Assert
+    expect(result).toBe(true);
+  });
+
+  it('should return false for elements without parents', () => {
+    // Arrange
+    const element = document.createElement('div');
+    
+    // Act
+    const result = hasHiddenParent(element);
+    
+    // Assert
+    expect(result).toBe(false);
+  });
+
+  it('should return false when element itself is hidden but parents are not', () => {
+    // Arrange
+    const parent = document.createElement('div');
+    const child = document.createElement('div');
+    
+    child.style.display = 'none'; // Child is hidden, but we're testing parents
+    parent.appendChild(child);
+    document.body.appendChild(parent);
+    
+    // Act
+    const result = hasHiddenParent(child);
+    
+    // Assert
+    expect(result).toBe(false); // Function checks parents, not the element itself
+  });
+
+  it('should return false for null or undefined elements', () => {
+    // Act & Assert
+    expect(hasHiddenParent(null)).toBe(false);
+    expect(hasHiddenParent(undefined)).toBe(false);
+  });
+
+  it('should return false for non-Element objects', () => {
+    // Arrange
+    const nonElements = [{}, [], 123, 'string', () => {}];
+    
+    // Act & Assert
+    nonElements.forEach(item => {
+      expect(hasHiddenParent(item)).toBe(false);
+    });
+  });
+
+  it('should handle complex nested DOM structures', () => {
+    // Arrange
+    // Create a more complex DOM structure
+    const structure = `
+      <div id="root">
+        <div id="level1">
+          <div id="level2-1">
+            <div id="target1"></div>
+          </div>
+          <div id="level2-2" style="display:none">
+            <div id="level3-1">
+              <div id="target2"></div>
+            </div>
+          </div>
+          <div id="level2-3" hidden>
+            <div id="target3"></div>
+          </div>
+        </div>
+      </div>
+    `;
+    
+    document.body.innerHTML = structure;
+    
+    const target1 = document.getElementById('target1');
+    const target2 = document.getElementById('target2');
+    const target3 = document.getElementById('target3');
+    
+    // Act
+    const result1 = hasHiddenParent(target1);
+    const result2 = hasHiddenParent(target2);
+    const result3 = hasHiddenParent(target3);
+    
+    // Assert
+    expect(result1).toBe(false); // No hidden parents
+    expect(result2).toBe(true);  // Has a hidden ancestor (level2-2)
+    expect(result3).toBe(true);  // Has a hidden ancestor (level2-3)
+  });
+});