Init Commit

2026-05-18 11:46:02 +02:00
commit 2de3502fbc
382 changed files with 19583 additions and 0 deletions
@@ -0,0 +1,167 @@
+import { test, expect } from '@playwright/test';
+
+const BASE_URL: string = process.env.TEST_BASE_URL ?? 'http://localhost:1313';
+
+if (!BASE_URL.startsWith('http')) {
+  throw new Error('TEST_BASE_URL must be a valid URL starting with http:// or https://');
+}
+console.log(`Running tests against ${BASE_URL}`);
+
+test.describe('Contact Form Functionality', () => {
+  test.beforeEach(async ({ page }) => {
+    // Navigate to the page with the contact form (usually footer)
+    await page.goto(BASE_URL);
+    // Scroll to the bottom of the page where the contact form is typically located
+    await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
+  });
+
+  test('contact form placeholders are visible', async ({ page }) => {
+    // Check that all form fields have visible placeholders
+    const nameInput = page.locator('form input[name="full_name"]');
+    const emailInput = page.locator('form input[name="email"]');
+    const phoneInput = page.locator('form input[name="phone"]');
+    const messageTextarea = page.locator('form textarea[name="message"]');
+    
+    // Verify the inputs exist
+    await expect(nameInput).toBeVisible();
+    await expect(emailInput).toBeVisible();
+    await expect(phoneInput).toBeVisible();
+    await expect(messageTextarea).toBeVisible();
+    
+    // Verify that placeholders are set
+    await expect(nameInput).toHaveAttribute('placeholder');
+    await expect(emailInput).toHaveAttribute('placeholder');
+    await expect(phoneInput).toHaveAttribute('placeholder');
+    await expect(messageTextarea).toHaveAttribute('placeholder');
+    
+    // Verify the placeholders aren't empty
+    const namePlaceholder = await nameInput.getAttribute('placeholder');
+    const emailPlaceholder = await emailInput.getAttribute('placeholder');
+    const phonePlaceholder = await phoneInput.getAttribute('placeholder');
+    const messagePlaceholder = await messageTextarea.getAttribute('placeholder');
+    
+    expect(namePlaceholder).toBeTruthy();
+    expect(emailPlaceholder).toBeTruthy();
+    expect(phonePlaceholder).toBeTruthy();
+    expect(messagePlaceholder).toBeTruthy();
+  });
+
+  test('contact form placeholders match values from shortcode', async ({ page }) => {
+    // Get the form field elements
+    const nameInput = page.locator('form input[name="full_name"]');
+    const emailInput = page.locator('form input[name="email"]');
+    const phoneInput = page.locator('form input[name="phone"]');
+    const messageTextarea = page.locator('form textarea[name="message"]');
+    
+    // Get the placeholder values
+    const namePlaceholder = await nameInput.getAttribute('placeholder');
+    const emailPlaceholder = await emailInput.getAttribute('placeholder');
+    const phonePlaceholder = await phoneInput.getAttribute('placeholder');
+    const messagePlaceholder = await messageTextarea.getAttribute('placeholder');
+    
+    // Log the placeholder values for debugging
+    console.log('Placeholder values:', {
+      name: namePlaceholder,
+      email: emailPlaceholder,
+      phone: phonePlaceholder,
+      message: messagePlaceholder
+    });
+    
+    // Verify placeholders have meaningful content
+    // The specific values will depend on what's set in your shortcode or defaults
+    // We're checking they're not empty and not just generic defaults
+    expect(namePlaceholder).toBeTruthy();
+    expect(namePlaceholder?.length).toBeGreaterThan(2);
+    
+    expect(emailPlaceholder).toBeTruthy();
+    expect(emailPlaceholder?.length).toBeGreaterThan(2);
+    
+    expect(phonePlaceholder).toBeTruthy();
+    expect(phonePlaceholder?.length).toBeGreaterThan(2);
+    
+    expect(messagePlaceholder).toBeTruthy();
+    expect(messagePlaceholder?.length).toBeGreaterThan(2);
+    
+    // Check that placeholders are not just "placeholder" or generic text
+    expect(namePlaceholder?.toLowerCase()).not.toBe('placeholder');
+    expect(emailPlaceholder?.toLowerCase()).not.toBe('placeholder');
+    expect(phonePlaceholder?.toLowerCase()).not.toBe('placeholder');
+    expect(messagePlaceholder?.toLowerCase()).not.toBe('placeholder');
+  });
+
+  test('contact form has proper CSS styling', async ({ page }) => {
+    // Verify that the form elements have the expected CSS classes
+    await expect(page.locator('section.section--contact')).toBeVisible();
+    await expect(page.locator('form.contact__form')).toHaveClass(/contact__form/);
+    
+    // Check specific form field styling
+    await expect(page.locator('input[name="full_name"]')).toHaveClass(/form-control/);
+    await expect(page.locator('input[name="email"]')).toHaveClass(/form-control/);
+    await expect(page.locator('input[name="phone"]')).toHaveClass(/form-control/);
+    await expect(page.locator('textarea[name="message"]')).toHaveClass(/form-control/);
+    
+    // Check submit button styling
+    await expect(page.locator('form.contact__form button[type="submit"]')).toHaveClass(/btn btn-primary/);
+  });
+
+  test('message textarea has the correct number of rows', async ({ page }) => {
+    // Verify that the textarea has the correct number of rows (default is 2)
+    const messageTextarea = page.locator('form textarea[name="message"]');
+    const rowsValue = await messageTextarea.getAttribute('rows');
+    
+    // The actual value will depend on your implementation, but should be at least "2"
+    expect(Number(rowsValue)).toBeGreaterThanOrEqual(2);
+  });
+
+  test('contact section displays correct information from shortcode', async ({ page }) => {
+    // Assuming the contact form has a title
+    const contactTitle = page.locator('section.section--contact h2');
+    await expect(contactTitle).toBeVisible();
+    
+    // Check contact information is displayed correctly
+    // For example, the phone number, email, and address sections
+    const contactInfo = page.locator('.contact__info');
+    await expect(contactInfo).toBeVisible();
+    
+    // Check headings in contact info section
+    const infoHeadings = contactInfo.locator('h3');
+    // Replace with a meaningful assertion if the expected count is known
+    await expect(infoHeadings).toHaveCount(3); // Example: Replace 3 with the actual expected count
+    // If your site has email info displayed, check it
+    const emailSection = contactInfo.locator('h3', { hasText: /mail|email/i }).first();
+    if (await emailSection.count() > 0) {
+      await expect(emailSection).toBeVisible();
+      // Check if there's an email value below the heading
+      const emailValue = emailSection.locator('+ span');
+      await expect(emailValue).toBeVisible();
+    }
+    
+    // If your site has phone info displayed, check it
+    const phoneSection = contactInfo.locator('h3', { hasText: /phone/i }).first();
+    if (await phoneSection.count() > 0) {
+      await expect(phoneSection).toBeVisible();
+      // Check if there's a phone value below the heading
+      const phoneValue = phoneSection.locator('+ span');
+      await expect(phoneValue).toBeVisible();
+    }
+  });
+
+  test('submit button displays text from the shortcode', async ({ page }) => {
+    // Check that the submit button has text content
+    const submitButton = page.locator('form.contact__form button[type="submit"]');
+    await expect(submitButton).toBeVisible();
+    const buttonText = await submitButton.textContent();
+    expect(buttonText?.trim()).toBeTruthy();
+  });
+
+  test('form action is set correctly', async ({ page }) => {
+    // Verify that the form has an action attribute
+    const form = page.locator('form').first();
+    const action = await form.getAttribute('action');
+    expect(action).toBeTruthy();
+    
+    // Also check the method attribute
+    const method = await form.getAttribute('method');
+    expect(method).toBeTruthy();
+  });
+});