jws-frontend/tests/01-Manage/MenuAgencies.spec.ts

import { test, expect, Page } from '@playwright/test';
import { de, fakerEN, fakerTH } from '@faker-js/faker';
import { isAwaitExpression } from 'typescript';

let page: Page;
let isLoginSuccessful = false;

test.beforeAll(async ({ browser }) => {
  page = await browser.newPage();
});

test.afterAll(async () => {
  if (page !== undefined) {
    await page.close();
  }
});
async function login(page: Page) {
  try {
    // Login
    await page.goto('/');
    await expect(page).toHaveTitle(/^Sign in to /);
    await page.fill("input[name='username']", 'admin');
    await page.fill("input[name='password']", '1234');
    await page.click('id=kc-login');
    await page.waitForTimeout(2000);
    //   await page.click('id=acceptBtn');
    // เข้าสู่หน้าแม่แบบขั้นตอนการทำงาน
    await page.click('id=menu.manage');
    await page.waitForSelector('id=sub-menu-agencies');
    await page.click('id=sub-menu-agencies');

    // ถ้าทั้งหมดสำเร็จ
    isLoginSuccessful = true;
    console.log('ระบบทำการ Login สำเร็จ');
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการ Login');
    isLoginSuccessful = false;
  }
}
test('Login', async () => {
  await login(page);
});

test('TC_2_0_001', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่เมนูหน่วยงาน

    const pageAgencies = page.locator(
      "//span[contains(@class,'title-gradient text-weight-bold')]",
    );
    await expect(pageAgencies).toHaveText('หน่วยงาน');
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงหน้าเมนูหน่วยงาน');
});

test('TC_2_0_002', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');
    await page.waitForSelector("(//input[@id='input-agencies-code'])[2]");
    await page.click("(//input[@id='input-agencies-code'])[2]");

    const dropdownAgenciesGroup = page.locator('id=input-agencies-code_lb');
    await expect(dropdownAgenciesGroup).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงรายการเลือกกลุ่มหน่วยงาน');
  await page.waitForSelector('id=btn-form-close');
  await page.click('id=btn-form-close');
});

test('TC_2_0_003', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');

    const pageCreateAgencies = page.locator(
      "//div[contains(@class,'col text-subtitle1')]",
    );
    await expect(pageCreateAgencies).toHaveText('เพิ่มหน่วยงาน');
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงหน้าเพิ่มหน่วยงาน');
  await page.waitForSelector('id=btn-form-close');
  await page.click('id=btn-form-close');
});

test('TC_2_0_004', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');

    // ส่วนข้อมูลพื้นฐาน
    await page.click("(//input[@id='input-agencies-code'])[2]");
    await page.waitForSelector('id=input-agencies-code_2');
    await page.click('id=input-agencies-code_2');
    await page.fill(
      "(//input[@id='input-agencies-name'])[2]",
      'สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.fill(
      "(//input[@id='input-agencies-name-en'])[2]",
      'Embassy of the Republic of Bulgaria in Thailand',
    );

    // ส่วนข้อมูลที่อยู่
    await page.fill(
      "(//input[@id='-input-address-no'])[2]",
      '100/45 อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24',
    );
    await page.fill("(//input[@id='-input-street'])[3]", 'สุขุมวิท 21 (อโศก)');
    await page.click("(//input[@id='-select-province'])[2]");
    await page.waitForSelector('id=-select-province_1');
    await page.click('id=-select-province_1');
    // การเลือก Dropdown ที่อยู่ข้างล่าง
    await page.click("(//input[@id='-select-district'])[2]"); // คลิกเปิด dropdown
    await page.waitForSelector('#-select-district_lb', { state: 'visible' });

    const targetOption = page.locator('[id="-select-district_40"]');
    for (let i = 0; i < 10 && !(await targetOption.isVisible()); i++) {
      await page
        .locator('#-select-district_lb')
        .evaluate((el) => (el.scrollTop += 150));
      await page.waitForTimeout(100);
    }

    if (await targetOption.isVisible()) {
      await targetOption.click();
      console.log('✅ เลือกตัวเลือกสำเร็จ');
    } else {
      console.error('❌ ไม่พบตัวเลือกที่ต้องการ');
    }
    await page.click("(//input[@id='-select-sub-district'])[2]");
    await page.waitForSelector('id=-select-sub-district_1');
    await page.click('id=-select-sub-district_1');
    await page.fill(
      "(//input[@id='-input-address-en'])[2]",
      '100/45 Ocean Tower 2, 24th Floor',
    );
    await page.waitForTimeout(1000);
    await page.click("(//button[@id='btn-info-basic-save'])[2]");

    const createAgencies = page.locator(
      "//tr[contains(.,'สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย') and contains (.,'อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24, ถนนสุขุมวิท 21 (อโศก), แขวงคลองเตยเหนือ, เขตวัฒนา, จังหวัดกรุงเทพมหานคร, 10110')]",
    );
    await expect(createAgencies).toContainText(
      'สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await expect(createAgencies).toContainText(
      'อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24, ถนนสุขุมวิท 21 (อโศก), แขวงคลองเตยเหนือ, เขตวัฒนา, จังหวัดกรุงเทพมหานคร, 10110',
    );
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบสามารถเพิ่มหน่วยงานได้');
});

test('TC_2_0_005', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');

    // ส่วนข้อมูลพื้นฐาน
    await page.fill(
      "(//input[@id='input-agencies-name'])[2]",
      'สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.fill(
      "(//input[@id='input-agencies-name-en'])[2]",
      'Embassy of the Republic of Bulgaria in Thailand',
    );

    // ส่วนที่อยู่
    await page.fill(
      "(//input[@id='input-agencies-name'])[2]",
      'สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.fill(
      "(//input[@id='input-agencies-name-en'])[2]",
      'Embassy of the Republic of Bulgaria in Thailand',
    );

    // ส่วนข้อมูลที่อยู่
    await page.fill(
      "(//input[@id='-input-address-no'])[2]",
      '100/45 อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24',
    );
    await page.fill("(//input[@id='-input-street'])[3]", 'สุขุมวิท 21 (อโศก)');
    await page.click("(//input[@id='-select-province'])[2]");
    await page.waitForSelector('id=-select-province_1');
    await page.click('id=-select-province_1');
    // การเลือก Dropdown ที่อยู่ข้างล่าง
    await page.click("(//input[@id='-select-district'])[2]"); // คลิกเปิด dropdown
    await page.waitForSelector('id=-select-district_2');
    await page.click('id=-select-district_2');
    await page.click("(//input[@id='-select-sub-district'])[2]");
    await page.waitForSelector('id=-select-sub-district_1');
    await page.click('id=-select-sub-district_1');
    await page.fill(
      "(//input[@id='-input-address-en'])[2]",
      '100/45 Ocean Tower 2, 24th Floor',
    );
    await page.waitForTimeout(1000);
    await page.click("(//button[@id='btn-info-basic-save'])[2]");

    //ตรวจสอบข้อผิดพลาดที่ต้องแสดง
    const expectedErrors = [
      {
        locator: "(//div[@class='q-field__messages col']//div)[1]",
        message: 'จำเป็นต้องกรอกข้อมูลนี้',
      },
    ];

    for (const error of expectedErrors) {
      const locator = page.locator(error.locator);
      await expect(locator).toHaveText(error.message);
    }
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบทำการแจ้งเตือนให้เลือกกลุ่มหน่วยงาน');
  await page.waitForSelector('id=btn-form-close');
  await page.click('id=btn-form-close');
});

test('TC_2_0_006', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');

    // ส่วนข้อมูลพื้นฐาน
    await page.click("(//input[@id='input-agencies-code'])[2]");
    await page.waitForSelector('id=input-agencies-code_2');
    await page.click('id=input-agencies-code_2');
    await page.fill(
      "(//input[@id='input-agencies-name-en'])[2]",
      'Embassy of the Republic of Bulgaria in Thailand',
    );

    // ส่วนข้อมูลที่อยู่
    await page.fill(
      "(//input[@id='-input-address-no'])[2]",
      '100/45 อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24',
    );
    await page.fill("(//input[@id='-input-street'])[3]", 'สุขุมวิท 21 (อโศก)');
    await page.click("(//input[@id='-select-province'])[2]");
    await page.waitForSelector('id=-select-province_1');
    await page.click('id=-select-province_1');
    // การเลือก Dropdown ที่อยู่ข้างล่าง
    await page.click("(//input[@id='-select-district'])[2]"); // คลิกเปิด dropdown
    await page.waitForSelector('id=-select-district_2');
    await page.click('id=-select-district_2');
    await page.click("(//input[@id='-select-sub-district'])[2]");
    await page.waitForSelector('id=-select-sub-district_1');
    await page.click('id=-select-sub-district_1');
    await page.fill(
      "(//input[@id='-input-address-en'])[2]",
      '100/45 Ocean Tower 2, 24th Floor',
    );
    await page.waitForTimeout(1000);
    await page.click("(//button[@id='btn-info-basic-save'])[2]");

    //ตรวจสอบข้อผิดพลาดที่ต้องแสดง
    const expectedErrors = [
      {
        locator: "(//div[@class='q-field__messages col']//div)[1]",
        message: 'จำเป็นต้องกรอกข้อมูลนี้',
      },
    ];

    for (const error of expectedErrors) {
      const locator = page.locator(error.locator);
      await expect(locator).toHaveText(error.message);
    }
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบทำการแจ้งเตือนให้กรอกชื่อหน่วยงาน');
  await page.waitForSelector('id=btn-form-close');
  await page.click('id=btn-form-close');
});

test('TC_2_0_007', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');

    // ส่วนข้อมูลพื้นฐาน
    await page.click("(//input[@id='input-agencies-code'])[2]");
    await page.waitForSelector('id=input-agencies-code_2');
    await page.click('id=input-agencies-code_2');
    await page.fill(
      "(//input[@id='input-agencies-name'])[2]",
      'สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.fill(
      "(//input[@id='input-agencies-name-en'])[2]",
      'Embassy of the Republic of Bulgaria in Thailand',
    );
    await page.waitForTimeout(1000);
    await page.click("(//button[@id='btn-info-basic-save'])[2]");

    //ตรวจสอบข้อผิดพลาดที่ต้องแสดง
    const expectedErrors = [
      {
        locator: "(//div[@class='q-field__messages col']//div)[1]",
        message: 'จำเป็นต้องกรอกข้อมูลนี้',
      },
      {
        locator: "(//div[@class='q-field__messages col']//div)[2]",
        message: 'โปรดเลือกจังหวัด',
      },
      {
        locator: "(//div[@class='q-field__messages col']//div)[3]",
        message: 'โปรดเลือกเขต/อำเภอ',
      },
      {
        locator: "(//div[@class='q-field__messages col']//div)[4]",
        message: 'โปรดเลือกแขวง/ตำบล',
      },
      {
        locator: "(//div[@class='q-field__messages col']//div)[5]",
        message: 'จำเป็นต้องกรอกข้อมูลนี้',
      },
    ];

    for (const error of expectedErrors) {
      const locator = page.locator(error.locator);
      await expect(locator).toHaveText(error.message);
    }
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบทำการแจ้งเตือนให้กรอกที่อยู่');
  await page.waitForSelector('id=btn-form-close');
  await page.click('id=btn-form-close');
});

test('TC_2_0_008', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.waitForSelector(
      'id=btn-kebab-edit-สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.click(
      'id=btn-kebab-edit-สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );

    // ตรวจสอบหลังแก้ไข
    const pageEditAgencies = page.locator('id=user-form-content');
    await expect(pageEditAgencies).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงหน้าแก้ไขหน่วยงาน');
  await page.click('id=btn-info-close');
});

test('TC_2_0_009', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.waitForSelector(
      'id=btn-kebab-edit-สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );
    await page.click(
      'id=btn-kebab-edit-สถานเอกอัครราชทูตสาธารณรัฐบัลแกเรีย ประจำประเทศไทย',
    );

    // ส่วนข้อมูลพื้นฐาน
    await page.fill(
      'id=input-agencies-name',
      'สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย',
    );
    await page.waitForTimeout(1000);
    await page.click('id=btn-info-basic-save');
    await page.waitForTimeout(1000);
    await page.click('id=btn-info-close');

    // ตรวจสอบหลังแก้ไข
    const editAgencies = page.locator(
      "//tr[contains(.,'สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย') and contains (.,'อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24, ถนนสุขุมวิท 21 (อโศก), แขวงคลองเตยเหนือ, เขตวัฒนา, จังหวัดกรุงเทพมหานคร, 10110')]",
    );
    await expect(editAgencies).toContainText(
      'สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย',
    );
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบสามารถแก้ไขหน่วยงานได้');
});

test('TC_2_0_010', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย',
    );
    await page.waitForSelector(
      'id=btn-kebab-delete-สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย',
    );
    await page.click(
      'id=btn-kebab-delete-สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย',
    );
    await page.waitForSelector('id=btn-ok-dialog');
    await page.click('id=btn-ok-dialog');

    // ตรวจสอบหลังลบ
    const editAgencies = page.locator(
      "//tr[contains(.,'สถานเอกอัครราชทูตสาธารณรัฐมอลต้า ประจำประเทศไทย') and contains (.,'อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24, ถนนสุขุมวิท 21 (อโศก), แขวงคลองเตยเหนือ, เขตวัฒนา, จังหวัดกรุงเทพมหานคร, 10110')]",
    );
    await expect(editAgencies).toBeHidden();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบสามารถลบหน่วยงานในกรณีที่ยังไม่มีการใช้งานได้');
});

test('TC_2_0_011', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่หน้าเพิ่มหน่วยงาน
    await page.waitForSelector('id=btn-add');
    await page.click('id=btn-add');

    // ส่วนข้อมูลพื้นฐาน
    await page.click("(//input[@id='input-agencies-code'])[2]");
    await page.waitForSelector('id=input-agencies-code_2');
    await page.click('id=input-agencies-code_2');
    await page.fill(
      "(//input[@id='input-agencies-name'])[2]",
      'สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.fill(
      "(//input[@id='input-agencies-name-en'])[2]",
      'Embassy of Japan in Thailand',
    );

    // ส่วนข้อมูลที่อยู่
    await page.fill(
      "(//input[@id='-input-address-no'])[2]",
      '100/45 อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24',
    );
    await page.fill("(//input[@id='-input-street'])[3]", 'สุขุมวิท 21 (อโศก)');
    await page.click("(//input[@id='-select-province'])[2]");
    await page.waitForSelector('id=-select-province_1');
    await page.click('id=-select-province_1');
    // การเลือก Dropdown ที่อยู่ข้างล่าง
    await page.click("(//input[@id='-select-district'])[2]"); // คลิกเปิด dropdown
    await page.waitForSelector('id=-select-district_1');
    await page.click('id=-select-district_1');
    await page.click("(//input[@id='-select-sub-district'])[2]");
    await page.waitForSelector('id=-select-sub-district_1');
    await page.click('id=-select-sub-district_1');
    await page.fill(
      "(//input[@id='-input-address-en'])[2]",
      '100/45 Ocean Tower 2, 24th Floor',
    );
    await page.waitForTimeout(1000);
    await page.click("(//button[@id='btn-info-basic-save'])[2]");

    // ปิดสถานะ
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.waitForSelector(
      'id=btn-kebab-status-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.click(
      'id=btn-kebab-status-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
      { force: true },
    );
    await page.waitForSelector('id=btn-ok-dialog');
    await page.click('id=btn-ok-dialog');
    await page.waitForTimeout(2000);
    // เปิดสถานะ
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.waitForSelector(
      'id=btn-kebab-status-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.click(
      'id=btn-kebab-status-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
      { force: true },
    );
    await page.waitForSelector('id=btn-ok-dialog');
    await page.click('id=btn-ok-dialog');

    // การลบหน่วยงานที่ภูกใช้งานแล้ว
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.waitForSelector(
      'id=btn-kebab-delete-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.click(
      'id=btn-kebab-delete-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );
    await page.waitForSelector('id=btn-ok-dialog');
    await page.click('id=btn-ok-dialog');

    // ตรวจการแจ้งเตือนการลบหน่วยงานในกรณีที่หน่วยงานถูกใช้งานแล้ว
    const popUpErrorAgenciesDeleted = page.locator(
      "//span[normalize-space(text())='หน่วยงานใช้งานอยู่.']",
    );
    await expect(popUpErrorAgenciesDeleted).toHaveText('หน่วยงานใช้งานอยู่.');
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบไม่สามารถลบหน่วยงานในกรณีที่มีการใช้งานได้');
  await page.click('id=btn-ok-dialog');
});

test('TC_2_0_012', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );

    await page.click(
      'id=btn-kebab-status-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
      {
        force: true,
      },
    );
    await page.click('id=btn-ok-dialog');
    console.log('เปลี่ยนสถานะสำเร็จ');

    // รอ Update
    await page.waitForTimeout(2000);
    console.log('สถานะถูกเปลี่ยนแล้ว');

    // ตรวจสอบสีของแถวหลังจากทำการเปลี่ยนสถานะ
    const rowLocator = page.locator(
      "//tr[contains(.,'สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย') and contains (.,'อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24, ถนนสุขุมวิท 21 (อโศก), แขวงทรายกองดินใต้, เขตคลองสามวา, จังหวัดกรุงเทพมหานคร, 10510')]",
    );
    const backgroundColor = await rowLocator.evaluate(
      (el) => window.getComputedStyle(el).backgroundColor,
    );

    // กำหนดสีหลัเปลี่ยนสถานะการใช้งาน
    const expectedColor = 'rgba(0, 0, 0, 0)';

    // ตรวจสอบสีที่เปลี่ยนไป
    expect(backgroundColor.trim()).toBe(expectedColor);
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบทำการปิดสถานะการใช้งานหน่วยงาน');
});

test('TC_2_0_013', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    await page.click(
      'id=btn-kebab-action-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
    );

    await page.click(
      'id=btn-kebab-status-สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย',
      {
        force: true,
      },
    );
    await page.click('id=btn-ok-dialog');
    console.log('เปลี่ยนสถานะสำเร็จ');

    // รอ Update
    await page.waitForTimeout(2000);
    console.log('สถานะถูกเปลี่ยนแล้ว');

    // ตรวจสอบสีของแถวหลังจากทำการเปลี่ยนสถานะ
    const rowLocator = page.locator(
      "//tr[contains(.,'สถานเอกอัครราชทูตญี่ปุ่น ประจำประเทศไทย') and contains (.,'อาคารโอเชียน ทาวเวอร์ 2 ชั้น 24, ถนนสุขุมวิท 21 (อโศก), แขวงทรายกองดินใต้, เขตคลองสามวา, จังหวัดกรุงเทพมหานคร, 10510')]",
    );
    const backgroundColor = await rowLocator.evaluate(
      (el) => window.getComputedStyle(el).backgroundColor,
    );

    // กำหนดสีหลัเปลี่ยนสถานะการใช้งาน
    const expectedColor = 'rgb(249, 250, 252)';

    // ตรวจสอบสีที่เปลี่ยนไป
    expect(backgroundColor.trim()).toBe(expectedColor);
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบทำการเปิดสถานะการใช้งานหน่วยงาน');
});

test('TC_2_0_014', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่เมนูหน่วยงาน

    const tableAgencies = page.locator("//tr[contains(.,'ลำดับชื่อที่อยู่')]");
    await expect(tableAgencies).toBeVisible();

    await page.waitForSelector("//div[@id='btn-mode']//button[1]");
    await page.click("//div[@id='btn-mode']//button[1]");

    const cardAgencies = page.locator(
      "(//section[contains(@class,'column col-12')])[1]",
    );
    await expect(cardAgencies).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงข้อมูลตารางและการ์ดของหน่วยงานทั้งหมด');
});

test('TC_2_0_015', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่เมนูหน่วยงาน

    const typeListAgencies = page.locator(
      "//div[contains(@class,'q-table__container q-table--horizontal-separator')]",
    );
    await expect(typeListAgencies).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงเมนูหน่วยงานในรูปแบบ List');
});

test('TC_2_0_016', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // คลิก Dropdown ฟิลด์แสดงผล
    await page.waitForSelector("(//div[@id='select-field'])[1]");
    await page.click("(//div[@id='select-field'])[1]");

    const dropdownFieldDisplay = page.locator('id=select-field_lb');
    await expect(dropdownFieldDisplay).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงรายการฟิลด์แสดงผล');
});

test('TC_2_0_017', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // การแสดงหน่วยงานในรูปแบบการ์ด
    await page.waitForSelector("//div[@id='btn-mode']//button[1]");
    await page.click("//div[@id='btn-mode']//button[1]");

    const typeCardAgencies = page.locator(
      "//div[contains(@class,'q-table__grid-content row')]",
    );
    await expect(typeCardAgencies).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงเมนูหน่วยงานในรูปแบบ Card');
});

test('TC_2_0_018', async () => {
  // ถ้ายังไม่ได้ Login ให้ทำการ Login
  if (!isLoginSuccessful) {
    await login(page);
  }
  try {
    // เข้าสู่เมนูหน่วยงาน

    const pageAgencies = page.locator(
      "//div[contains(@class,'stat-card__content row')]",
    );
    await expect(pageAgencies).toBeVisible();
  } catch (error) {
    console.error('เกิดข้อผิดพลาดในการทดสอบ', error);
    isLoginSuccessful = false;
    throw error;
  }
  await page.waitForTimeout(2000);
  console.log('ระบบแสดงจำนวนหน่วยงานทั้งหมด');
});