fix: use Playwright click({force:true}) for mat-checkbox trusted events

Non-trusted events (evaluate/dispatchEvent) don't trigger Angular
Material MDC change detection. Playwright's click({force:true}) fires
trusted events while bypassing visibility checks.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: renemadsen

eform-client/playwright/e2e/plugins/items-planning-pn/ItemsPlanningPairingPage.ts

@@ -142,25 +142,16 @@ export class PairingRowObject {
     clickCancel = false
   ) {
     if (clickOnPairRow) {
-      await this.pairRowForClick.evaluate((el: HTMLElement) => {
-        const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-        if (input) input.click();
-      });
+      await this.pairRowForClick.click({ force: true });
       await this.page.waitForTimeout(500);
       if ((await this.pairRow.locator('input').isChecked()) !== pair) {
-        await this.pairRowForClick.evaluate((el: HTMLElement) => {
-          const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-          if (input) input.click();
-        });
+        await this.pairRowForClick.click({ force: true });
         await this.page.waitForTimeout(500);
       }
     } else {
       for (let i = 0; i < this.pairCheckboxesForClick.length; i++) {
         if ((await this.pairCheckboxes[i].locator('input').isChecked()) !== pair) {
-          await this.pairCheckboxesForClick[i].evaluate((el: HTMLElement) => {
-            const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-            if (input) input.click();
-          });
+          await this.pairCheckboxesForClick[i].click({ force: true });
           await this.page.waitForTimeout(500);
         }
       }
@@ -173,10 +164,7 @@ export class PairingRowObject {
     indexDeviceForPair: number,
     clickCancel = false
   ) {
-    await this.pairCheckboxesForClick[indexDeviceForPair].evaluate((el: HTMLElement) => {
-      const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-      if (input) input.click();
-    });
+    await this.pairCheckboxesForClick[indexDeviceForPair].click({ force: true });
     await this.page.waitForTimeout(1000);
     await this.pairingPage.savePairing(clickCancel);
   }
@@ -228,25 +216,16 @@ export class PairingColObject {
     clickCancel = false
   ) {
     if (clickOnPairRow) {
-      await this.pairColForClick.evaluate((el: HTMLElement) => {
-        const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-        if (input) input.click();
-      });
+      await this.pairColForClick.click({ force: true });
       await this.page.waitForTimeout(500);
       if ((await this.pairCol.locator('input').isChecked()) !== pair) {
-        await this.pairColForClick.evaluate((el: HTMLElement) => {
-          const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-          if (input) input.click();
-        });
+        await this.pairColForClick.click({ force: true });
         await this.page.waitForTimeout(500);
       }
     } else {
       for (let i = 0; i < this.pairCheckboxesForClick.length; i++) {
         if ((await this.pairCheckboxes[i].locator('input').isChecked()) !== pair) {
-          await this.pairCheckboxesForClick[i].evaluate((el: HTMLElement) => {
-            const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-            if (input) input.click();
-          });
+          await this.pairCheckboxesForClick[i].click({ force: true });
           await this.page.waitForTimeout(500);
         }
       }

eform-client/playwright/e2e/plugins/items-planning-pn/ItemsPlanningPlanningPage.ts

@@ -211,11 +211,8 @@ export class ItemsPlanningPlanningPage extends PageWithNavbarPage {
 
   async selectAllPlanningsForDelete(valueCheckbox = true, pickOne = false) {
     if (!pickOne) {
-      // Click the native input inside mat-checkbox — triggers Angular Material's _handleInputClick
-      await this.selectAllPlanningsCheckbox.evaluate((el: HTMLElement) => {
-        const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-        if (input) input.click();
-      });
+      // Use force:true to fire a trusted click on the mat-checkbox even if visually hidden
+      await this.selectAllPlanningsCheckbox.click({ force: true });
       await this.page.waitForTimeout(1000);
     } else {
       const plannings = await this.getAllPlannings(0, false);
@@ -455,10 +452,7 @@ export class PlanningRowObject {
   async clickOnCheckboxForMultipleDelete(valueCheckbox = true) {
     const isChecked = await this.checkboxDelete.locator('input').isChecked().catch(() => false);
     if (isChecked !== valueCheckbox) {
-      await this.checkboxDelete.evaluate((el: HTMLElement) => {
-        const input = el.querySelector('input[type="checkbox"]') as HTMLInputElement;
-        if (input) input.click();
-      });
+      await this.checkboxDelete.click({ force: true });
       await this.page.waitForTimeout(500);
     }
   }