diff --git a/resources/views/penduduk/index.blade.php b/resources/views/penduduk/index.blade.php
index 8cf98991..1add1f80 100644
--- a/resources/views/penduduk/index.blade.php
+++ b/resources/views/penduduk/index.blade.php
@@ -145,6 +145,7 @@
"filter[id_asuransi]": $('#id_asuransi').val(),
"filter[hamil]": $('#hamil').val(),
"filter[suku]": $('#suku').val(),
+ "filter[pekerja_migran]": $('#pekerja_migran').val(),
"filter[status_covid]": $('#status_covid').val(),
"filter[status_rekam]": $('#status_rekam').val(),
"filter[pendidikan_kk_id]": $('#pendidikan_kk_id').val(),
diff --git a/tests/config-loader.js b/tests/config-loader.js
new file mode 100644
index 00000000..f2e2d423
--- /dev/null
+++ b/tests/config-loader.js
@@ -0,0 +1,157 @@
+const fs = require('fs');
+const path = require('path');
+
+class E2EConfigLoader {
+ constructor() {
+ this.config = this.loadConfiguration();
+ }
+
+ loadConfiguration() {
+ let config = this.getDefaultConfig();
+
+ // Load environment file
+ try {
+ const envPath = path.join(__dirname, '..', '.env.e2e');
+ if (fs.existsSync(envPath)) {
+ this.loadEnvFile(envPath);
+ }
+ } catch (error) {
+ console.warn('Could not load .env.e2e:', error.message);
+ }
+
+ // Override with environment variables
+ config = this.overrideWithEnv(config);
+
+ return config;
+ }
+
+ getDefaultConfig() {
+ return {
+ auth: {
+ email: 'test@test.com', // Test user yang dibuat
+ password: 'password' // Password yang diketahui
+ },
+ app: {
+ baseURL: 'http://localhost:8000',
+ timeout: 30000,
+ phpVersion: 'php' // Default PHP executable
+ },
+ database: {
+ connection: 'mysql',
+ host: 'localhost',
+ port: 3306,
+ database: 'opendesa_test',
+ username: 'root',
+ password: 'secret'
+ },
+ testData: {
+ },
+ browser: {
+ headless: true,
+ slowMo: 0
+ },
+ media: {
+ screenshot: 'only-on-failure',
+ video: 'retain-on-failure',
+ trace: 'on-first-retry'
+ }
+ };
+ }
+
+ loadEnvFile(filePath) {
+ const envContent = fs.readFileSync(filePath, 'utf8');
+ envContent.split('\n').forEach(line => {
+ const [key, ...valueParts] = line.split('=');
+ if (key && valueParts.length > 0) {
+ const value = valueParts.join('=').trim();
+ process.env[key.trim()] = value;
+ }
+ });
+ }
+
+ overrideWithEnv(config) {
+ // Auth overrides
+ if (process.env.E2E_ADMIN_EMAIL) {
+ config.auth.email = process.env.E2E_ADMIN_EMAIL;
+ }
+ if (process.env.E2E_ADMIN_PASSWORD) {
+ config.auth.password = process.env.E2E_ADMIN_PASSWORD;
+ }
+
+ // App overrides
+ if (process.env.E2E_APP_URL) {
+ config.app.baseURL = process.env.E2E_APP_URL;
+ }
+ if (process.env.E2E_TIMEOUT) {
+ config.app.timeout = parseInt(process.env.E2E_TIMEOUT);
+ }
+ if (process.env.E2E_PHP_VERSION) {
+ config.app.phpVersion = process.env.E2E_PHP_VERSION;
+ }
+
+ // Database overrides
+ if (process.env.E2E_DB_CONNECTION) {
+ config.database.connection = process.env.E2E_DB_CONNECTION;
+ }
+ if (process.env.E2E_DB_HOST) {
+ config.database.host = process.env.E2E_DB_HOST;
+ }
+ if (process.env.E2E_DB_PORT) {
+ config.database.port = parseInt(process.env.E2E_DB_PORT);
+ }
+ if (process.env.E2E_DB_DATABASE) {
+ config.database.database = process.env.E2E_DB_DATABASE;
+ }
+ if (process.env.E2E_DB_USERNAME) {
+ config.database.username = process.env.E2E_DB_USERNAME;
+ }
+ if (process.env.E2E_DB_PASSWORD) {
+ config.database.password = process.env.E2E_DB_PASSWORD;
+ }
+
+ // Browser overrides
+ if (process.env.E2E_HEADLESS) {
+ config.browser.headless = process.env.E2E_HEADLESS === 'true';
+ }
+ if (process.env.E2E_SLOWMO) {
+ config.browser.slowMo = parseInt(process.env.E2E_SLOWMO);
+ }
+
+ // Media overrides
+ if (process.env.E2E_SCREENSHOT) {
+ config.media.screenshot = process.env.E2E_SCREENSHOT;
+ }
+ if (process.env.E2E_VIDEO) {
+ config.media.video = process.env.E2E_VIDEO;
+ }
+ if (process.env.E2E_TRACE) {
+ config.media.trace = process.env.E2E_TRACE;
+ }
+
+ return config;
+ }
+
+ mergeConfig(target, source) {
+ const merged = { ...target };
+
+ for (const key in source) {
+ if (source[key] && typeof source[key] === 'object' && !Array.isArray(source[key])) {
+ merged[key] = this.mergeConfig(merged[key] || {}, source[key]);
+ } else {
+ merged[key] = source[key];
+ }
+ }
+
+ return merged;
+ }
+
+ get(path = '') {
+ if (!path) return this.config;
+
+ return path.split('.').reduce((obj, key) => obj?.[key], this.config);
+ }
+}
+
+// Singleton instance
+const configLoader = new E2EConfigLoader();
+module.exports = configLoader;
diff --git a/tests/e2e/dashboard.spec.js b/tests/e2e/dashboard.spec.js
new file mode 100644
index 00000000..8073336e
--- /dev/null
+++ b/tests/e2e/dashboard.spec.js
@@ -0,0 +1,134 @@
+const { test, expect } = require('@playwright/test');
+const configLoader = require('../config-loader');
+const E2ETestHelper = require('../utils/e2e-helper');
+
+test.describe('Dashboard Tests', () => {
+ // Test ini menggunakan authentication state dari global setup
+
+ test.beforeEach(async ({ page }) => {
+ page.setDefaultTimeout(30000);
+ page.setDefaultNavigationTimeout(30000);
+ E2ETestHelper.setupPageLogging(page);
+ });
+
+ test('should access dashboard when authenticated', async ({ page }) => {
+ await page.goto('/dasbor');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Verify we're on the dashboard page
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).toContain('/dasbor');
+
+ // Check page title
+ const title = await E2ETestHelper.getPageTitle(page);
+ expect(title).toBeTruthy();
+ expect(title).toContain('Dasbor');
+
+ // Check for authenticated user elements
+ const hasUserMenu = await page.locator('.user-menu, .navbar-nav .dropdown, [class*="user"], .nav-link').count() > 0;
+ expect(hasUserMenu).toBeTruthy();
+
+ // Check for dashboard widgets/cards
+ const hasDashboardContent = await page.locator('.card, .widget, .dashboard-item, .content-wrapper').count() > 0;
+ expect(hasDashboardContent).toBeTruthy();
+
+ // Verify not redirected to login
+ expect(currentUrl).not.toContain('/login');
+ });
+
+ test('should display dashboard statistics', async ({ page }) => {
+ await page.goto('/dasbor');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Wait for statistics to load
+ await page.waitForTimeout(3000);
+
+ // Check for statistics cards or elements
+ const statsElements = await page.locator('.card, .stat-card, .info-box, .small-box').count();
+ expect(statsElements).toBeGreaterThan(0);
+
+ // Check for any charts or graphs
+ const hasCharts = await page.locator('canvas, .chart, #chart, [id*="chart"]').count() > 0;
+ // Charts might not always be present, so we just log this
+ console.log('Dashboard has charts:', hasCharts);
+ });
+
+ test('should have working navigation menu', async ({ page }) => {
+ await page.goto('/dasbor');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Check for sidebar or main navigation
+ const hasNavigation = await page.locator('.sidebar, .nav, .navbar, .main-navigation').count() > 0;
+ expect(hasNavigation).toBeTruthy();
+
+ // Check for menu items
+ const menuItems = await page.locator('.nav-link, .menu-item, a[href*="/"]').count();
+ expect(menuItems).toBeGreaterThan(0);
+
+ // Try clicking on a safe menu item (avoid logout)
+ const safeMenuItems = page.locator('.nav-link:not([href*="logout"]):not([href*="keluar"])').first();
+ if (await safeMenuItems.count() > 0) {
+ await safeMenuItems.click();
+ await page.waitForTimeout(1000);
+
+ // Verify navigation worked (page changed or content updated)
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).toBeTruthy();
+ }
+ });
+
+ test('should display user information', async ({ page }) => {
+ await page.goto('/dasbor');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Check for user name or profile information
+ const pageContent = await page.textContent('body');
+
+ // The user should be logged in, so we shouldn't see login forms
+ expect(pageContent).not.toContain('Login');
+ expect(pageContent).not.toContain('Sign In');
+
+ // Should have some indication of logged in state
+ const hasUserIndicator = await page.locator('.user-name, .username, .profile, [class*="user"]').count() > 0;
+ // This might vary by implementation, so we just check if we're not on login page
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).not.toContain('/login');
+ });
+
+ test('should handle page reload while authenticated', async ({ page }) => {
+ await page.goto('/dasbor');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Verify initial load
+ let currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).toContain('/dasbor');
+
+ // Reload the page
+ await page.reload();
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Verify still authenticated after reload
+ currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).toContain('/dasbor');
+ expect(currentUrl).not.toContain('/login');
+ });
+
+ test('should have proper page structure', async ({ page }) => {
+ await page.goto('/dasbor');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Check for basic HTML structure
+ await expect(page.locator('html')).toBeVisible();
+ await expect(page.locator('head')).toHaveCount(1);
+ await expect(page.locator('body')).toBeVisible();
+
+ // Check for meta tags
+ const viewportMeta = page.locator('meta[name="viewport"]');
+ await expect(viewportMeta).toHaveCount(1);
+
+ // Check for title
+ const title = await page.title();
+ expect(title).toBeTruthy();
+ expect(title.length).toBeGreaterThan(0);
+ });
+});
diff --git a/tests/e2e/homepage-disable.spec.js b/tests/e2e/homepage-disable.spec.js
new file mode 100644
index 00000000..708971ec
--- /dev/null
+++ b/tests/e2e/homepage-disable.spec.js
@@ -0,0 +1,34 @@
+const { test, expect, chromium } = require('@playwright/test');
+const configLoader = require('../config-loader');
+const E2ETestHelper = require('../utils/e2e-helper');
+const AuthStateManager = require('../utils/auth-state-manager');
+const WebSettingsHelper = require('../utils/web-settings-helper');
+
+test.describe('Disable Website Homepage Tests', () => {
+ let authManager;
+
+ test.beforeAll(async () => {
+ authManager = new AuthStateManager(configLoader);
+ const browser = await chromium.launch({ headless: true });
+ const page = await browser.newPage();
+ const webSettings = new WebSettingsHelper(page, authManager);
+ await webSettings.setUpdateSettingViaWeb('website_enable',false);
+ });
+
+ // Test ini tidak menggunakan authentication state karena homepage adalah public
+ test.use({ storageState: { cookies: [], origins: [] } });
+
+ test.beforeEach(async ({ page }) => {
+ page.setDefaultTimeout(30000);
+ page.setDefaultNavigationTimeout(30000);
+ E2ETestHelper.setupPageLogging(page);
+ });
+
+ test('should show error when website is disabled', async ({ page }) => {
+
+ expect(async () => {
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+ })
+ });
+});
diff --git a/tests/e2e/homepage.spec.js b/tests/e2e/homepage.spec.js
new file mode 100644
index 00000000..12da5b29
--- /dev/null
+++ b/tests/e2e/homepage.spec.js
@@ -0,0 +1,81 @@
+const { test, expect, chromium } = require('@playwright/test');
+const configLoader = require('../config-loader');
+const E2ETestHelper = require('../utils/e2e-helper');
+const AuthStateManager = require('../utils/auth-state-manager');
+const WebSettingsHelper = require('../utils/web-settings-helper');
+
+test.describe('Homepage Tests', () => {
+ let authManager;
+
+ test.beforeAll(async () => {
+ authManager = new AuthStateManager(configLoader);
+ const browser = await chromium.launch({ headless: true });
+ const page = await browser.newPage();
+ // Aktifkan website melalui web interface (table -> edit -> form flow)
+ const webSettings = new WebSettingsHelper(page, authManager);
+ await webSettings.setUpdateSettingViaWeb('website_enable',true);
+ });
+
+ // Test ini tidak menggunakan authentication state karena homepage adalah public
+ test.use({ storageState: { cookies: [], origins: [] } });
+
+ test.beforeEach(async ({ page }) => {
+ page.setDefaultTimeout(30000);
+ page.setDefaultNavigationTimeout(30000);
+ E2ETestHelper.setupPageLogging(page);
+ });
+
+ // run test
+
+ test('should display homepage when website is enabled', async ({ page }) => {
+
+ await page.goto('/');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Check page title
+ const title = await E2ETestHelper.getPageTitle(page);
+ expect(title).toBeTruthy();
+ expect(title).not.toBe('404');
+
+ // Check for main homepage elements
+ await expect(page.locator('body')).toBeVisible();
+
+ // Check for navigation menu (biasanya ada di homepage)
+ const hasNavigation = await page.locator('nav, .navbar, .menu').count() > 0;
+ expect(hasNavigation).toBeTruthy();
+
+ // Check for main content area
+ const hasMainContent = await page.locator('main, .content, .container').count() > 0;
+ expect(hasMainContent).toBeTruthy();
+
+ // Verify page is not an error page
+ const pageContent = await page.textContent('body');
+ expect(pageContent).not.toContain('404');
+ expect(pageContent).not.toContain('Not Found');
+ expect(pageContent).not.toContain('Error');
+ });
+
+ test('should have responsive design', async ({ page }) => {
+ await page.goto('/');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Test mobile viewport
+ await page.setViewportSize({ width: 375, height: 667 });
+ await page.waitForTimeout(1000);
+
+ // Check if page is still functional on mobile
+ const bodyVisible = await page.locator('body').isVisible();
+ expect(bodyVisible).toBeTruthy();
+
+ // Test tablet viewport
+ await page.setViewportSize({ width: 768, height: 1024 });
+ await page.waitForTimeout(1000);
+
+ // Check if page is still functional on tablet
+ const bodyVisibleTablet = await page.locator('body').isVisible();
+ expect(bodyVisibleTablet).toBeTruthy();
+
+ // Reset to desktop
+ await page.setViewportSize({ width: 1280, height: 720 });
+ });
+});
diff --git a/tests/e2e/login.spec.js b/tests/e2e/login.spec.js
new file mode 100644
index 00000000..e047196a
--- /dev/null
+++ b/tests/e2e/login.spec.js
@@ -0,0 +1,173 @@
+const { test, expect } = require('@playwright/test');
+const configLoader = require('../config-loader');
+const E2ETestHelper = require('../utils/e2e-helper');
+const AuthStateManager = require('../utils/auth-state-manager');
+
+test.describe('Login Page Tests', () => {
+ // Test ini tidak menggunakan authentication state karena kita ingin test login
+ test.use({ storageState: { cookies: [], origins: [] } });
+
+ test.beforeEach(async ({ page }) => {
+ page.setDefaultTimeout(30000);
+ page.setDefaultNavigationTimeout(30000);
+ E2ETestHelper.setupPageLogging(page);
+ });
+
+ test('should display login page correctly', async ({ page }) => {
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Check page title
+ const title = await E2ETestHelper.getPageTitle(page);
+ expect(title).toBeTruthy();
+
+ // Check login form elements
+ await expect(page.locator('input[name="login"]')).toBeVisible();
+ await expect(page.locator('input[name="password"]')).toBeVisible();
+ await expect(page.locator('button[type="submit"]')).toBeVisible();
+
+ // Check for CSRF token
+ const csrfTokenInput = page.locator('input[name="_token"]');
+ const csrfTokenMeta = page.locator('meta[name="csrf-token"]');
+
+ const hasCSRFInput = await csrfTokenInput.count() > 0;
+ const hasCSRFMeta = await csrfTokenMeta.count() > 0;
+
+ expect(hasCSRFInput || hasCSRFMeta).toBeTruthy();
+ });
+
+ test('should login successfully with valid credentials', async ({ page }) => {
+ const email = configLoader.get('auth.email');
+ const password = configLoader.get('auth.password');
+
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Fill login form
+ await E2ETestHelper.fillFormField(page, 'input[name="login"]', email);
+ await E2ETestHelper.fillFormField(page, 'input[name="password"]', password);
+
+ // Submit form and wait for navigation
+ await Promise.all([
+ page.waitForNavigation({ waitUntil: 'networkidle' }),
+ E2ETestHelper.clickElement(page, 'button[type="submit"]')
+ ]);
+
+ // Verify successful login - should be redirected away from login page
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).not.toContain('/login');
+
+ // Should be redirected to dashboard or main page
+ expect(currentUrl).toMatch(/\/(dasbor|dashboard|admin|home)/);
+
+ // Verify we're authenticated by checking for user elements
+ await page.waitForTimeout(2000);
+ const hasAuthenticatedElements = await page.locator('.user-menu, .logout, .nav-link, .username').count() > 0;
+ expect(hasAuthenticatedElements).toBeTruthy();
+ });
+
+ test('should show error for invalid credentials', async ({ page }) => {
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Fill with invalid credentials
+ await E2ETestHelper.fillFormField(page, 'input[name="login"]', 'invalid@email.com');
+ await E2ETestHelper.fillFormField(page, 'input[name="password"]', 'wrongpassword');
+
+ // Submit form
+ await E2ETestHelper.clickElement(page, 'button[type="submit"]');
+ await page.waitForTimeout(2000);
+
+ // Should still be on login page or show error
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ const isOnLoginPage = currentUrl.includes('/login');
+
+ // Check for error messages
+ const hasErrorMessage = await page.locator('.alert-danger, .error, .invalid-feedback, [class*="error"]').count() > 0;
+
+ // Either should stay on login page OR show error message
+ expect(isOnLoginPage || hasErrorMessage).toBeTruthy();
+ });
+
+ test('should validate required fields', async ({ page }) => {
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Try to submit without filling fields
+ await E2ETestHelper.clickElement(page, 'button[type="submit"]');
+ await page.waitForTimeout(1000);
+
+ // Should still be on login page
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).toContain('/login');
+
+ // Check for validation messages or HTML5 validation
+ const emailField = page.locator('input[name="login"]');
+ const passwordField = page.locator('input[name="password"]');
+
+ // HTML5 validation might prevent form submission
+ const emailValidation = await emailField.evaluate(el => el.validationMessage);
+ const passwordValidation = await passwordField.evaluate(el => el.validationMessage);
+
+ // At least one field should have validation message or we should still be on login page
+ expect(emailValidation || passwordValidation || currentUrl.includes('/login')).toBeTruthy();
+ });
+
+ test('should redirect authenticated user away from login', async ({ page }) => {
+ // First, login with valid credentials
+ const authManager = new AuthStateManager(configLoader);
+
+ // Get or create auth state
+ await authManager.getAuthState();
+
+ // Get stored cookies and add them to the page context
+ const cookies = await authManager.getStoredCookies();
+ if (cookies.length > 0) {
+ await page.context().addCookies(cookies);
+ }
+
+ // Try to access login page when already authenticated
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+
+ // Should be redirected away from login page
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+
+ // Either redirected immediately or after a short delay
+ if (currentUrl.includes('/login')) {
+ await page.waitForTimeout(2000);
+ const newUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(newUrl).not.toContain('/login');
+ } else {
+ expect(currentUrl).not.toContain('/login');
+ }
+ });
+
+ test('should handle remember me functionality', async ({ page }) => {
+ await page.goto('/login');
+ await E2ETestHelper.waitForPageReady(page);
+
+ const email = configLoader.get('auth.email');
+ const password = configLoader.get('auth.password');
+
+ // Fill login form
+ await E2ETestHelper.fillFormField(page, 'input[name="login"]', email);
+ await E2ETestHelper.fillFormField(page, 'input[name="password"]', password);
+
+ // Check remember me if it exists
+ const rememberCheckbox = page.locator('input[name="remember"], input[type="checkbox"]');
+ if (await rememberCheckbox.count() > 0) {
+ await rememberCheckbox.check();
+ }
+
+ // Submit form
+ await Promise.all([
+ page.waitForNavigation({ waitUntil: 'networkidle' }),
+ E2ETestHelper.clickElement(page, 'button[type="submit"]')
+ ]);
+
+ // Verify successful login
+ const currentUrl = await E2ETestHelper.getCurrentUrl(page);
+ expect(currentUrl).not.toContain('/login');
+ });
+});
diff --git a/tests/global-setup.js b/tests/global-setup.js
new file mode 100644
index 00000000..48006407
--- /dev/null
+++ b/tests/global-setup.js
@@ -0,0 +1,21 @@
+const configLoader = require('./config-loader');
+const AuthStateManager = require('./utils/auth-state-manager');
+
+async function globalSetup() {
+ console.log('Starting global setup for E2E tests...');
+
+ try {
+ // Initialize auth state manager
+ const authManager = new AuthStateManager(configLoader);
+
+ // Get or create authentication state
+ await authManager.getAuthState();
+
+ console.log('Global setup completed successfully');
+ } catch (error) {
+ console.error('Global setup failed:', error.message);
+ throw error;
+ }
+}
+
+module.exports = globalSetup;
diff --git a/tests/test-setup.js b/tests/test-setup.js
new file mode 100644
index 00000000..2b5eb2a3
--- /dev/null
+++ b/tests/test-setup.js
@@ -0,0 +1,41 @@
+const { execSync } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+
+class TestSetup {
+ static async clearCache() {
+ try {
+ console.log('Clearing application cache...');
+
+ const commands = [
+ 'php artisan config:clear',
+ 'php artisan route:clear',
+ 'php artisan view:clear',
+ 'php artisan cache:clear'
+ ];
+
+ for (const command of commands) {
+ execSync(command, {
+ cwd: path.join(__dirname, '..'),
+ stdio: 'inherit'
+ });
+ }
+
+ console.log('Cache cleared successfully');
+ return true;
+ } catch (error) {
+ console.error('Failed to clear cache:', error.message);
+ return false;
+ }
+ }
+
+ static getStorageStatePath() {
+ const storageDir = path.join(__dirname, '..', 'test-results', 'storage-state');
+ if (!fs.existsSync(storageDir)) {
+ fs.mkdirSync(storageDir, { recursive: true });
+ }
+ return path.join(storageDir, 'auth.json');
+ }
+}
+
+module.exports = TestSetup;
diff --git a/tests/utils/auth-state-manager.js b/tests/utils/auth-state-manager.js
new file mode 100644
index 00000000..92e40a8a
--- /dev/null
+++ b/tests/utils/auth-state-manager.js
@@ -0,0 +1,179 @@
+const { chromium } = require('@playwright/test');
+const path = require('path');
+const fs = require('fs');
+
+class AuthStateManager {
+ constructor(configLoader) {
+ this.configLoader = configLoader;
+ this.storageStatePath = path.join(__dirname, '..', '..', 'test-results', 'storage-state', 'auth.json');
+ this.ensureStorageDir();
+ }
+
+ ensureStorageDir() {
+ const storageDir = path.dirname(this.storageStatePath);
+ if (!fs.existsSync(storageDir)) {
+ fs.mkdirSync(storageDir, { recursive: true });
+ }
+ }
+
+ async isAuthStateValid() {
+ if (!fs.existsSync(this.storageStatePath)) {
+ return false;
+ }
+
+ try {
+ const authState = JSON.parse(fs.readFileSync(this.storageStatePath, 'utf8'));
+
+ // Check if auth state has cookies and they're not expired
+ if (!authState.cookies || authState.cookies.length === 0) {
+ return false;
+ }
+
+ // Check for session cookies that might indicate valid authentication
+ const hasSessionCookie = authState.cookies.some(cookie =>
+ cookie.name.includes('session') ||
+ cookie.name.includes('token') ||
+ cookie.name.includes('laravel')
+ );
+
+ return hasSessionCookie;
+ } catch (error) {
+ console.warn('Error reading auth state:', error.message);
+ return false;
+ }
+ }
+
+ async createAuthState() {
+ console.log('Creating new authentication state...');
+
+ const browser = await chromium.launch({ headless: true });
+ const page = await browser.newPage();
+
+ // Ignore API errors to prevent test failures due to external API calls
+ page.on('pageerror', (error) => {
+ console.warn('Page error (ignored):', error.message);
+ });
+
+ page.on('requestfailed', (request) => {
+ console.warn('Request failed (ignored):', request.url());
+ });
+
+ try {
+ const baseURL = this.configLoader.get('app.baseURL');
+ const email = this.configLoader.get('auth.email');
+ const password = this.configLoader.get('auth.password');
+
+ console.log(`Config - BaseURL: ${baseURL}`);
+ console.log(`Config - Email: ${email}`);
+ console.log(`Config - Password: ${password}`);
+
+ // Navigate to login page with retry
+ let retries = 3;
+ while (retries > 0) {
+ try {
+ await page.goto(`${baseURL}/login`, {
+ waitUntil: 'networkidle',
+ timeout: 30000
+ });
+ break;
+ } catch (error) {
+ retries--;
+ if (retries === 0) throw error;
+ console.warn(`Retrying login page navigation... (${retries} attempts left)`);
+ await page.waitForTimeout(2000);
+ }
+ }
+
+ // Wait for login form to be ready
+ await page.waitForSelector('input[name="login"]', { timeout: 10000 });
+ await page.waitForSelector('input[name="password"]', { timeout: 10000 });
+ await page.waitForSelector('button[type="submit"]', { timeout: 10000 });
+
+ // Fill login form
+ await page.fill('input[name="login"]', email);
+ await page.fill('input[name="password"]', password);
+
+ // Submit form and wait for navigation
+ await Promise.all([
+ page.waitForURL(url => !url.toString().includes('/login'), { timeout: 30000 }),
+ page.click('button[type="submit"]')
+ ]);
+
+ // Verify login success
+ const currentUrl = page.url();
+ const isLoggedIn = !currentUrl.includes('/login');
+
+ if (!isLoggedIn) {
+ // Try to get error message
+ const errorElement = await page.locator('.alert-danger, .error, .invalid-feedback').first();
+ const errorMessage = await errorElement.textContent().catch(() => 'Unknown error');
+ throw new Error(`Login failed. Current URL: ${currentUrl}. Error: ${errorMessage}`);
+ }
+
+ // Save authentication state
+ await page.context().storageState({ path: this.storageStatePath });
+ console.log(`Authentication state saved to: ${this.storageStatePath}`);
+
+ return true;
+ } catch (error) {
+ console.error('Failed to create auth state:', error.message);
+ throw error;
+ } finally {
+ await browser.close();
+ }
+ }
+
+ async getAuthState() {
+ const isValid = await this.isAuthStateValid();
+
+ if (!isValid) {
+ await this.createAuthState();
+ } else {
+ console.log('Using existing authentication state');
+ }
+
+ return this.storageStatePath;
+ }
+
+ clearAuthState() {
+ if (fs.existsSync(this.storageStatePath)) {
+ fs.unlinkSync(this.storageStatePath);
+ console.log('Authentication state cleared');
+ }
+ }
+
+ async refreshAuthState() {
+ this.clearAuthState();
+ return await this.createAuthState();
+ }
+
+ async getStoredCookies() {
+ try {
+ if (!fs.existsSync(this.storageStatePath)) {
+ return [];
+ }
+
+ const authState = JSON.parse(fs.readFileSync(this.storageStatePath, 'utf8'));
+ return authState.cookies || [];
+ } catch (error) {
+ console.warn('Error reading stored cookies:', error.message);
+ return [];
+ }
+ }
+
+ async getStorageState() {
+ if (!fs.existsSync(this.storageStatePath)) {
+ await this.createAuthState();
+ }
+
+ try {
+ return JSON.parse(fs.readFileSync(this.storageStatePath, 'utf8'));
+ } catch (error) {
+ console.warn('Error reading storage state:', error.message);
+ await this.createAuthState();
+ return JSON.parse(fs.readFileSync(this.storageStatePath, 'utf8'));
+ }
+ }
+}
+
+module.exports = AuthStateManager;
diff --git a/tests/utils/e2e-helper.js b/tests/utils/e2e-helper.js
new file mode 100644
index 00000000..afd50789
--- /dev/null
+++ b/tests/utils/e2e-helper.js
@@ -0,0 +1,97 @@
+const { expect } = require('@playwright/test');
+
+class E2ETestHelper {
+ static async waitForPageReady(page, timeout = 10000) {
+ await page.waitForLoadState('networkidle', { timeout });
+ }
+
+ static async fillFormField(page, selector, value, options = {}) {
+ const element = page.locator(selector);
+ await element.waitFor({ state: 'visible', timeout: options.timeout || 10000 });
+ await element.fill(value);
+ }
+
+ static async clickElement(page, selector, options = {}) {
+ const element = page.locator(selector);
+ await element.waitFor({ state: 'visible', timeout: options.timeout || 10000 });
+ await element.click();
+ }
+
+ static async takeScreenshotOnFailure(page, testInfo) {
+ if (testInfo.status !== testInfo.expectedStatus) {
+ const screenshot = await page.screenshot();
+ await testInfo.attach('screenshot', { body: screenshot, contentType: 'image/png' });
+ }
+ }
+
+ static setupPageLogging(page) {
+ page.on('console', msg => {
+ if (msg.type() === 'error') {
+ console.log(`PAGE ERROR: ${msg.text()}`);
+ }
+ });
+
+ page.on('pageerror', error => {
+ console.log(`PAGE CRASH: ${error.message}`);
+ });
+
+ page.on('requestfailed', request => {
+ console.log(`REQUEST FAILED: ${request.url()} - ${request.failure()?.errorText}`);
+ });
+ }
+
+ static async waitForElement(page, selector, options = {}) {
+ const timeout = options.timeout || 10000;
+ const state = options.state || 'visible';
+
+ return await page.waitForSelector(selector, {
+ state,
+ timeout
+ });
+ }
+
+ static async expectElementToContainText(page, selector, text, options = {}) {
+ const element = page.locator(selector);
+ await element.waitFor({ state: 'visible', timeout: options.timeout || 10000 });
+ await expect(element).toContainText(text);
+ }
+
+ static async getPageTitle(page) {
+ return await page.title();
+ }
+
+ static async getCurrentUrl(page) {
+ return page.url();
+ }
+
+ static async isAuthenticated(page) {
+ // Check if we're not on login page
+ const currentUrl = await this.getCurrentUrl(page);
+ return !currentUrl.includes('/login');
+ }
+
+ static async hasUserMenu(page) {
+ // Check for common user menu elements
+ const userMenuSelectors = [
+ '.user-menu',
+ '.navbar-nav .dropdown',
+ '[class*="user"]',
+ '.dropdown-toggle'
+ ];
+
+ for (const selector of userMenuSelectors) {
+ const count = await page.locator(selector).count();
+ if (count > 0) {
+ return true;
+ }
+ }
+ return false;
+ }
+
+ static async navigateAndWait(page, url) {
+ await page.goto(url);
+ await this.waitForPageReady(page);
+ }
+}
+
+module.exports = E2ETestHelper;
diff --git a/tests/utils/web-settings-helper.js b/tests/utils/web-settings-helper.js
new file mode 100644
index 00000000..70721886
--- /dev/null
+++ b/tests/utils/web-settings-helper.js
@@ -0,0 +1,164 @@
+class WebSettingsHelper {
+ constructor(page, authStateManager) {
+ this.page = page;
+ this.authStateManager = authStateManager;
+ }
+
+ // Navigate to admin settings page
+ async navigateToSettings() {
+ // Ensure we're authenticated
+ const cookies = await this.authStateManager.getStoredCookies();
+ if (cookies.length > 0) {
+ await this.page.context().addCookies(cookies);
+ }
+
+ // Navigate to settings page
+ const route = '/pengaturan/settings';
+
+ try {
+ await this.page.goto(route);
+ await this.page.waitForLoadState('networkidle', { timeout: 10000 });
+
+ // Check if we're on a settings page (look for table with settings)
+ const hasSettingsTable = await this.page.locator('table, .table, .settings-table').count() > 0;
+ if (hasSettingsTable) {
+ console.log(`Found settings page at: ${route}`);
+ return true;
+ }
+ } catch (error) {
+ console.warn(`Could not access ${route}:`, error.message);
+ }
+
+ throw new Error('Could not find settings page');
+ }
+
+ // Find setting row by key/code and return the row element
+ async findSettingRow(settingKey) {
+ // Look for table row that contains the setting key
+ const rowSelectors = [
+ `tr:has(td:text("${settingKey}"))`,
+ ];
+
+ for (const selector of rowSelectors) {
+ try {
+ const row = this.page.locator(selector).first();
+ if (await row.count() > 0) {
+ console.log(`Found setting row for "${settingKey}" with selector: ${selector}`);
+ return row;
+ }
+ } catch (error) {
+ // Continue trying other selectors
+ }
+ }
+
+ return null;
+ }
+
+ // Find and click edit button for a specific setting
+ async clickEditButtonForSetting(settingKey) {
+ const settingRow = await this.findSettingRow(settingKey);
+
+ if (!settingRow) {
+ throw new Error(`Setting row for "${settingKey}" not found`);
+ }
+
+ // Look for edit button in the row
+ const editButtonSelectors = [
+ 'a[href*="edit"]' // Common selectors for edit buttons
+ ];
+
+ for (const selector of editButtonSelectors) {
+ const editButton = settingRow.locator(selector).first();
+ // get the closest element to the edit button
+
+ if (await editButton.count() > 0) {
+ console.log(`Found edit button for "${settingKey}" with selector: ${selector}`);
+ // Get the href attribute text
+ const href = await editButton.getAttribute('href');
+ return href;
+ }
+ }
+
+ throw new Error(`Edit button for setting "${settingKey}" not found`);
+ }
+
+ // Update website enabled setting via web interface
+ async setUpdateSettingViaWeb(settingKey, value = 1) {
+ await this.navigateToSettings();
+
+ // Find and click edit button for website_enabled setting
+ const link = await this.clickEditButtonForSetting(settingKey);
+ await this.page.goto(link);
+
+ // Now we should be on the edit form page
+ await this.page.waitForLoadState('networkidle');
+
+ // Find the value input field in the edit form
+ const valueFieldSelectors = [
+ 'input[name="value"]',
+ 'select[name="value"]',
+ ];
+
+ let fieldFound = false;
+ for (const selector of valueFieldSelectors) {
+ const valueField = this.page.locator(selector);
+ if (await valueField.count() > 0) {
+ console.log(`Found value field with selector: ${selector}`);
+
+ const tagName = await valueField.evaluate(el => el.tagName.toLowerCase());
+ const newValue = value ? '1' : '0';
+
+ if (tagName === 'select') {
+ await valueField.selectOption(newValue);
+ } else {
+ await valueField.fill(newValue);
+ }
+
+ fieldFound = true;
+ break;
+ }
+ }
+
+ if (fieldFound) {
+ await this.submitForm();
+ } else {
+ console.warn('Value field not found in edit form');
+ }
+ }
+
+ // Submit form after editing
+ async submitForm() {
+ const submitSelectors = [
+ 'button[type="submit"]',
+ 'input[type="submit"]',
+ ];
+
+ for (const selector of submitSelectors) {
+ const submitBtn = this.page.locator(selector);
+ if (await submitBtn.count() > 0) {
+ await submitBtn.click();
+ await this.page.waitForLoadState('networkidle');
+ console.log(`Submitted form using: ${selector}`);
+
+ // Wait for success message or redirect back to settings list
+ await this.page.waitForTimeout(2000);
+ return true;
+ }
+ }
+
+ console.warn('Submit button not found');
+ return false;
+ }
+
+ // Check if settings page is accessible
+ async isSettingsAccessible() {
+ try {
+ await this.navigateToSettings();
+ return true;
+ } catch (error) {
+ return false;
+ }
+ }
+}
+
+module.exports = WebSettingsHelper;