83 lines
		
	
	
		
			No EOL
		
	
	
		
			3.5 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			83 lines
		
	
	
		
			No EOL
		
	
	
		
			3.5 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
| import { test, expect } from '@playwright/test';
 | |
| import { LoginPage } from './LoginPage';
 | |
| import { DashboardPage } from './DashboardPage';
 | |
| import { TEST_USERS } from '../data/test-users';
 | |
| 
 | |
| test.describe('Debug Description Field', () => {
 | |
|     test('Find description field selector', async ({ page }) => {
 | |
|         const loginPage = new LoginPage(page);
 | |
|         const dashboardPage = new DashboardPage(page);
 | |
|         const trainer = TEST_USERS.trainer;
 | |
|         
 | |
|         // Login and navigate to create event
 | |
|         await loginPage.navigateToLogin();
 | |
|         await loginPage.login(trainer.username, trainer.password);
 | |
|         await dashboardPage.clickCreateEvent();
 | |
|         
 | |
|         // Wait for form to load
 | |
|         await page.waitForTimeout(3000);
 | |
|         
 | |
|         // Try different selectors for the description field
 | |
|         const descriptionSelectors = [
 | |
|             '#content',
 | |
|             'textarea#content',
 | |
|             'textarea[name="content"]',
 | |
|             '#content-html',
 | |
|             '#content-visual',
 | |
|             '.wp-editor-area',
 | |
|             '#content_ifr', // TinyMCE iframe
 | |
|             'iframe#content_ifr',
 | |
|             '.mce-content-body',
 | |
|             'div[contenteditable="true"]',
 | |
|             '.mce-edit-area',
 | |
|             '#mceu_27-body', // TinyMCE body
 | |
|             'textarea.wp-editor-area'
 | |
|         ];
 | |
|         
 | |
|         for (const selector of descriptionSelectors) {
 | |
|             try {
 | |
|                 const element = page.locator(selector);
 | |
|                 if (await element.isVisible()) {
 | |
|                     const tagName = await element.evaluate(el => el.tagName);
 | |
|                     const id = await element.evaluate(el => el.id);
 | |
|                     const name = await element.evaluate(el => (el as any).name);
 | |
|                     const contentEditable = await element.evaluate(el => el.contentEditable);
 | |
|                     
 | |
|                     console.log(`Found element with selector "${selector}":`);
 | |
|                     console.log(`  Tag: ${tagName}, ID: ${id}, Name: ${name}, ContentEditable: ${contentEditable}`);
 | |
|                     
 | |
|                     // If it's an iframe, check inside it
 | |
|                     if (tagName === 'IFRAME') {
 | |
|                         const frame = page.frameLocator(selector);
 | |
|                         const bodyElement = frame.locator('body');
 | |
|                         if (await bodyElement.isVisible()) {
 | |
|                             console.log('  Found body inside iframe - this is the TinyMCE editor');
 | |
|                         }
 | |
|                     }
 | |
|                 }
 | |
|             } catch (e) {
 | |
|                 // Ignore errors
 | |
|             }
 | |
|         }
 | |
|         
 | |
|         // Check if we need to switch to text mode
 | |
|         const textTabButton = page.locator('button#content-html, a#content-html');
 | |
|         if (await textTabButton.isVisible()) {
 | |
|             console.log('\nFound "Text" tab button - clicking to switch to text mode');
 | |
|             await textTabButton.click();
 | |
|             await page.waitForTimeout(1000);
 | |
|             
 | |
|             // Now check for textarea
 | |
|             const textarea = page.locator('textarea#content, textarea.wp-editor-area');
 | |
|             if (await textarea.isVisible()) {
 | |
|                 console.log('Found textarea after switching to text mode');
 | |
|                 await textarea.fill('Test description in text mode');
 | |
|                 console.log('Successfully filled description in text mode');
 | |
|             }
 | |
|         }
 | |
|         
 | |
|         // Take screenshot
 | |
|         await page.screenshot({ path: 'description-field-debug.png', fullPage: true });
 | |
|         console.log('\nScreenshot saved as description-field-debug.png');
 | |
|     });
 | |
| }); |