WordPress PlugIn testing

WordPress plugins are designed to enhance the functionality and performance of your WordPress website. We can run an automation test to see plug-in installation,  activation, and configuration of the plugin's settings to customize the appearance and behavior of the plug-in to suit your website's design and preferences.

Plugin info: https://wordpress.org/plugins/wp-dark-mode/

Target/goals

following scenarios, which will be replicated

1. Log in to your WordPress site.
2. Check whether the “WP Dark Mode” Plugin is Active or not.
3. If Active, navigate to the WP Dark Mode & continue. Otherwise, Install the Plugin and Activate it.
4. Enable Backend Darkmode from Settings -> General Settings.
5. Validate whether the dark mode is working or not on the Admin Dashboard.
6. Navigate to the WP Dark Mode.
7. From Settings -> Switch Settings - Change the “Floating Switch Style” from the default selections (Select any one from the available options, except the default selected one).
8. From Settings -> Switch Settings - Select Custom Switch size & Scale it to 220.
9. From Settings -> Switch Settings - Change the Floating Switch Position (Left Bottom).
10. Disable Keyboard Shortcut from the Accessibility Settings.
11. From Settings -> Animation - Enable “Darkmode Toggle Animation” & change the “Animation Effect” from the default selections (Select any one from the available options, except the default selected one).
12. Validate whether the Darkmode is working or not from the Frontend.

Prerequisites

Install Xampp: https://www.apachefriends.org/download.html

Open Xampp to start Apache and MySQL

Download Wordpress file: https://wordpress.org/download/

Create the database(watch to the .env.example file):

My file directory
[DB_HOST = localhost
DB_PORT = 3306
DB_DATABASE = assignmentwp
DB_USERNAME =root
DB_PASSWORD= ]

Test workflow

Test file information

The following instructions will help you navigate those testing pages. We will create some packages. At the package level, there is a list of classes where you can create methods, use methods for particular pages, and run and test the testing pages separately

1. Set Environment
   i) pom.xml [dependencies set]
   ii) BrowserSetup[create separate package ]

2. Page Object Model: create methods, using methods for separate page and create test cases of those pages
   i) Methods[package name:TestingMethodsAndPages]
   ii) Page objects[package name:TestingMethodsAndPages]
   iii) TestCases [package name: Testpages ]

3. Create Allure report
   i) pom.xml [dependencies set for allure report]
   ii) Testng.xml [to run all test file togather]

Package Visualization:

Set Environment

Create a Maven Project Set pom.xml file pom.xml file Code: Set Under Dependencies

  <dependencies>
      <!-- https://mvnrepository.com/artifact/org.testng/testng -->
<dependency>
    <groupId>org.testng</groupId>
    <artifactId>testng</artifactId>
    <version>7.6.1</version>
    <scope>test</scope>
</dependency>
<!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
<dependency>
    <groupId>org.seleniumhq.selenium</groupId>
    <artifactId>selenium-java</artifactId>
    <version>4.6.0</version>
</dependency>
<!-- https://mvnrepository.com/artifact/io.github.bonigarcia/webdrivermanager -->
<dependency>
    <groupId>io.github.bonigarcia</groupId>
    <artifactId>webdrivermanager</artifactId>
    <version>5.3.0</version>
</dependency>
  </dependencies>
</project>

Create Some class under Packages One of the package will hold BorwserSetup in which we run the automation Code

Inside BorwserSetup Class:

It will hold three Driver(Chrome, Firefox, and Edge), use according to your preferences I prefer to use the Edge Driver (Edge Browser) to run my code.

package Wppool.AssignmentWP;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.edge.EdgeDriver;
import org.openqa.selenium.edge.EdgeOptions;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.firefox.FirefoxOptions;
import org.testng.annotations.AfterSuite;
import org.testng.annotations.BeforeSuite;
import io.github.bonigarcia.wdm.WebDriverManager;

public class BrowserSetup {
	private static String BrowserName = System.getProperty("browser", "Edge");
	private static final ThreadLocal<WebDriver> DRIVER_LOCAL = new ThreadLocal<>();
	public static WebDriver getDriver() {
		return DRIVER_LOCAL.get();
	}
	public static void setDriver(WebDriver driver) {
		BrowserSetup.DRIVER_LOCAL.set(driver);
	}
	public static WebDriver getBrowser(String BrowserName) {
		switch (BrowserName.toLowerCase()) {
		case "chrome":
			ChromeOptions option1 = new ChromeOptions();
			option1.addArguments("--remote-allow-origins=*");
			WebDriverManager.chromedriver().setup();
			return new ChromeDriver(option1);
		case "edge":
			EdgeOptions option2 = new EdgeOptions();
			option2.addArguments("--remote-allow-origins=*");
			WebDriverManager.edgedriver().setup();
			return new EdgeDriver(option2);
		case "firefox":
			FirefoxOptions option3 = new FirefoxOptions();
			option3.addArguments("--remote-allow-origins=*");
			WebDriverManager.firefoxdriver().setup();
			return new FirefoxDriver(option3);
		default:
			throw new RuntimeException("Browser Not found");
		}
	}
	@BeforeSuite
	public static synchronized void setBrowser() {
		WebDriver webDriver = getBrowser(BrowserName);
		webDriver.manage().window().maximize();
		setDriver(webDriver);
	}
	@AfterSuite
	public static synchronized void quitBrowser() {
		getDriver().quit();
	}
}

Page Object model

Methods

Create a package which include classes like method and other testing Page

method class includes methods of getElement, click, hover, field fillup, visible wait element, click wait element and take screenshot for allure report. This class appears to contain various methods for interacting with web elements using Selenium WebDriver. Here's a brief overview of the methods:

• getElement(By locator): Returns a WebElement located by the given By locator.
• clickElement(By locator): Clicks on the WebElement identified by the provided locator.
• FieldValue(By locator, String text): Enters the specified text into the input field identified by the given locator.
• WaitElementVisible(By locator): Waits for the visibility of the element located by the provided locator with a timeout of 20 seconds.
• Hover(By locator): Performs a hover action on the element located by the given locator using the Actions class.
• DropDownSelectElement(By locator): Selects the first option in the dropdown list identified by the given locator.
• takeScreenshot(String name): Captures a screenshot and attaches it to the Allure report with the specified name.

package TestingMethodsAndPages;

import static Wppool.AssignmentWP.BrowserSetup.getDriver;
import java.io.ByteArrayInputStream;
import java.time.Duration;
import org.openqa.selenium.By;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.Select;
import org.openqa.selenium.support.ui.WebDriverWait;
import io.qameta.allure.Allure;

public class Methods {
	public WebElement getElement(By locator) {
		//import static Wppool.AssignmentWP.BrowserSetup.getDriver;
		return getDriver().findElement(locator//driver = getDriver(
	}
	public void clickElement(By locator) {
		getElement(locator).click(
	}
	public void FieldValue(By locator, String text) {
		getElement(locator).sendKeys(text
	}
	public void WaitElementVisible(By locator) {
		WebDriverWait wait = new WebDriverWait(getDriver(), Duration.ofSeconds(20)
		wait.until(ExpectedConditions.visibilityOfElementLocated(locator)
	}
	public void Hover(By locator) {
		Actions action = new Actions(getDriver()
		//action.moveToElement(driver.findElement(locator)).perform(
		action.moveToElement(getElement(locator)).perform(;
	}
	public void DropDownSelectElement(By locator) {
		Select	select = new Select(getElement(locator)
		select.selectByIndex(0
	}
	//for allure report
		public void takeScreenshot(String name) {
			Allure.addAttachment(name, new ByteArrayInputStream(((TakesScreenshot)getDriver()).getScreenshotAs(OutputType.BYTES))
		}
}

Scenario Replication Classes

Login to Dashbord

1. Log in to your WordPress site.
2. Check whether the “WP Dark Mode” Plugin is Active or not.
   Login to Dashbord page objects and there intented xpaths
   Overview of the sleecing path of the login page image:
   

This class represent a set of methods related to the WordPress login portal. Here's a brief overview of the class:
Element Locators:
USERNAME: Locator for the username input field.
PASSWORD: Locator for the password input field.
LOGINBUTTON: Locator for the login button.
DASHBORD: Locator for the Dashboard heading.
SAKIF: Locator for the element containing the display name "Sakif."
LOGOUT: Locator for the logout link.
Method: WordPressLogin()
Attempts to log in to WordPress with a predefined username and password. Calls methods from the Methods class, such as FieldValue, clickElement, and WaitElementVisible.
Video Guidence: https://drive.google.com/file/d/1Mm98bgFtf1igQCeTzpkEtHvdBjwfYPbk/view?usp=drive_link
Login to Dashbord objects and methods

package TestingMethodsAndPages;

import org.openqa.selenium.By;

public class WordPressLoginPortal extends Methods{
	public By USERNAME = "//input[@id='user_login']"
	public By PASSWORD = "//input[@id='user_pass']"
	public By LOGINBUTTON = "//input[@id='wp-submit']"
	public By DASHBORD = "//h1[normalize-space()='Dashboard']"
	public By SAKIF = "(//span[@class='display-name'][normalize-space()='Sakif'])[1]"
	public By LOGOUT ="//a[@class='ab-item'][normalize-space()='Log Out']"
	
	public void WordPressLogin() throws InterruptedException{
		FieldValue(USERNAME, "Sakif"
		Thread.sleep(2000
		FieldValue(PASSWORD, "sakif@006"
		Thread.sleep(2000
		clickElement(LOGINBUTTON
		WaitElementVisible(DASHBORD
		Thread.sleep(2000
	}
}

Login to Dashbord testSuite

package TestPages;

import org.testng.annotations.Test;

import TestingMethodsAndPages.WordPressLoginPortal;
import Wppool.AssignmentWP.BrowserSetup;

public class LoginToDashbord extends BrowserSetup {
	WordPressLoginPortal login = new WordPressLoginPortal(
	@Test(description = "Secenario 1 = Before WP DarkMode plugin Dashbord looks like")
	public void WPlogin() throws InterruptedException{
		getDriver().get("http://localhost/wordpress-6.3.1/wordpress/wp-admin"
		Thread.sleep(2000
		login.WordPressLogin(
		login.takeScreenshot("Dashbord Before plugin"
		login.Hover(login.SAKIF
		login.clickElement(login.LOGOUT
	}
}

Replication of three, four, and five scenarios(3,4, and 5):

3. If Active, navigate to the WP Dark Mode & continue. Otherwise, Install the Plugin and Activate it.
4. Enable Backend Darkmode from Settings -> General Settings.
5. Validate whether the Darkmode is working or not on the Admin Dashboard.
   To replicate those scenario:
   Fields xpath: Overview of the sleecing path of the login page image:
   

After login to dashbord go to plugin option in the menu bar and hover to wait add plugins option is visible, then click it and wait for track the Add plugins page visible then fill up search field to search WP Dark Mode when the desire plug in option visible then install it and wait for activation button appears and the activate it.
Videp guidence:

This class appears to represent a set of methods related to setting up Dark Mode settings in a WordPress environment. Here's a brief overview of the class:

• Element Locators:
  DARKMODESETTINGSMENU: Locator for the WP Dark Mode settings menu.
  WaitDMsettingsVisible: Locator for the "Settings" link to wait for visibility.
  WaitSettingPage: Locator for the heading on the WP Dark Mode Settings page.
  EnableBackendDarkMode: Locator for enabling backend dark mode.
  DASHBOARD: Locator for the Dashboard link.
  WaitDashbord: Locator for waiting for the Dashboard heading to be visible.
  VALIDATEMODEBUTTON: Locator for a button to validate the dark mode.
  Method: setUpSetting()
• Performs a series of actions to set up Dark Mode settings:
  Hovers over the Dark Mode settings menu.
  Waits for the "Settings" link to be visible.
  Clicks on the "Settings" link.
  Waits for the WP Dark Mode Settings page to be visible.
  Clicks on the button to enable backend dark mode.
  Clicks on the Dashboard link.
  Waits for the Dashboard heading to be visible.
  Clicks on the button to validate the dark mode.
  Takes screenshots at two different points in the process.
  Plugin install to activation

package TestingMethodsAndPages;

import org.openqa.selenium.By;
//
public class SetupSettings extends Methods {
	public By DARKMODESETTINGSMENU = "//div[normalize-space()='WP Dark Mode']"
	public By WaitDMsettingsVisible = "//a[contains(text(),'Settings')]"
	public By WaitSettingPage ="//h2[normalize-space()='WP Dark Mode Settings']"
	public By EnableBackendDarkMode = "(//div[@class='wp-dark-mode-ignore'])[2]"
	public By DASHBORD = "//div[normalize-space()='Dashboard']"
	public By WaitDashbord = "//h1[normalize-space()='Dashboard']"
	public By VALIDATEMODEBUTTON = "//p[@class='dark wp-dark-mode-ignore']"
	public void setUpSetting() throws InterruptedException{
		Hover(DARKMODESETTINGSMENU
		WaitElementVisible(WaitDMsettingsVisible
		Thread.sleep(2000
		clickElement(WaitDMsettingsVisible
		WaitElementVisible(WaitSettingPage
		clickElement(EnableBackendDarkMode
		Thread.sleep(2000
		clickElement(DASHBORD
		WaitElementVisible(WaitDashbord
		clickElement(VALIDATEMODEBUTTON
		//screenshot
		Thread.sleep(2000
		clickElement(VALIDATEMODEBUTTON
		//screenshot
		Thread.sleep(2000
	}

}

Plugin install to activation TestSuite[Run as TestNG]

package TestPages;

import org.testng.annotations.Test;

import TestingMethodsAndPages.PluginInstallation;
import TestingMethodsAndPages.WordPressLoginPortal;
import Wppool.AssignmentWP.BrowserSetup;

public class PlugInInstallDirectoryPage extends BrowserSetup {
	WordPressLoginPortal login = new WordPressLoginPortal(
	PluginInstallation DarkModePlugIn = new PluginInstallation(
	@Test(description = "Scenario 2 & 3 = WP Dark Mode Installation")
	public void pluginInstall() throws InterruptedException{
		getDriver().get("http://localhost/wordpress-6.3.1/wordpress/wp-admin"
		Thread.sleep(2000
		login.WordPressLogin(
		DarkModePlugIn.PluginInstal(
		Thread.sleep(3000
		login.Hover(login.SAKIF
		login.clickElement(login.LOGOUT
		
	}

}

This class appears to represent a set of methods related to setting up Dark Mode settings in a WordPress environment. Here's a brief overview of the class:

• Element Locators: DARKMODESETTINGSMENU: Locator for the WP Dark Mode settings menu.
  WaitDMsettingsVisible: Locator for the "Settings" link to wait for visibility.
  WaitSettingPage: Locator for the heading on the WP Dark Mode Settings page.
  EnableBackendDarkMode: Locator for enabling backend dark mode.
  DASHBOARD: Locator for the Dashboard link.
  WaitDashbord: Locator for waiting for the Dashboard heading to be visible.
  VALIDATEMODEBUTTON: Locator for a button to validate the dark mode.
  Method: setUpSetting()
• Performs a series of actions to set up Dark Mode settings: Hovers over the Dark Mode settings menu.
  Waits for the "Settings" link to be visible.
  Clicks on the "Settings" link.
  Waits for the WP Dark Mode Settings page to be visible.
  Clicks on the button to enable backend dark mode.
  Clicks on the Dashboard link.
  Waits for the Dashboard heading to be visible.
  Clicks on the button to validate the dark mode.
  Takes screenshots at two different points in the process.
  Dark mode plugin settings and options appear image:
  
  Validate whether the Darkmode is working or not on the Admin Dashboard by using dedicated xpaths.

Validate Darkmode methods

package TestingMethodsAndPages;
import org.openqa.selenium.By;
public class SetupSettings extends Methods {
	public By DARKMODESETTINGSMENU = "//div[normalize-space()='WP Dark Mode']"
	public By WaitDMsettingsVisible = "//a[contains(text(),'Settings')]"
	public By WaitSettingPage ="//h2[normalize-space()='WP Dark Mode Settings']"
	public By EnableBackendDarkMode = "(//div[@class='wp-dark-mode-ignore'])[2]"
	public By DASHBORD = "//div[normalize-space()='Dashboard']"
	public By WaitDashbord = "//h1[normalize-space()='Dashboard']"
	public By VALIDATEMODEBUTTON = "//p[@class='dark wp-dark-mode-ignore']"
	public void setUpSetting() throws InterruptedException{
		Hover(DARKMODESETTINGSMENU
		WaitElementVisible(WaitDMsettingsVisible
		Thread.sleep(2000
		clickElement(WaitDMsettingsVisible
		WaitElementVisible(WaitSettingPage
		clickElement(EnableBackendDarkMode
		Thread.sleep(2000
		clickElement(DASHBORD
		WaitElementVisible(WaitDashbord
		clickElement(VALIDATEMODEBUTTON
		//screenshot
		Thread.sleep(2000
		clickElement(VALIDATEMODEBUTTON
		//screenshot
		Thread.sleep(2000
	}

}

Validate Darkmode TestSuite[Run as TestNG]

package TestPages;

import org.testng.annotations.Test;

import TestingMethodsAndPages.SetupSettings;
import TestingMethodsAndPages.WordPressLoginPortal;
import Wppool.AssignmentWP.BrowserSetup;

public class ValidateDarkmodeAdminDashbord extends BrowserSetup{
	WordPressLoginPortal login = new WordPressLoginPortal(
	SetupSettings validateDMode = new SetupSettings(
	@Test(description = "Secenario 4 & 5 = Validate WP DarkMode plugin Dashbord")
	public void ValidateDarkModeDashbord() throws InterruptedException{
		getDriver().get("http://localhost/wordpress-6.3.1/wordpress/wp-admin"
		Thread.sleep(2000
		login.WordPressLogin(
		validateDMode.setUpSetting(
		login.Hover(login.SAKIF
		login.clickElement(login.LOGOUT
	}
}

Now secenario 6 to 11:

6. Navigate to the WP Dark Mode.
7. From Settings -> Switch Settings - Change the “Floating Switch Style” from the default selections (Select any one from the available options, except the default selected one).
8. From Settings -> Switch Settings - Select Custom Switch size & Scale it to 220.
9. From Settings -> Switch Settings - Change the Floating Switch Position (Left Bottom).
10. Disable Keyboard Shortcut from the Accessibility Settings.
11. From Settings -> Animation - Enable “Darkmode Toggle Animation” & change the “Animation Effect” from the default selections (Select any one from the available options, except the default selected one).

Select xpath overview:

This class contain a set of methods related to switching settings in a Dark Mode feature in a WordPress environment. Here's a brief overview of the class:

• Element Locators:
  DMSETTINGSMENU: Locator for the WP Dark Mode settings menu.
  WaitVisibleDMsettings: Locator for the "Settings" link to wait for visibility.
  SWITCHSETTINGS: Locator for the "Switch Settings" link.
  WaitSwitchSettingPage: Locator for waiting for the Switch Settings page to be visible.
  FloatingSwitchStyle: Locator for a floating switch style element.
  SwitchStyleCustomButton: Locator for the "Custom" button related to switch style.
  SELECT: Locator for a dropdown element.
  SAVEBUTTON: Locator for the save button.
  AccessibleSettings: Locator for the "Accessibility Settings" link.
  AccesibleSettingPage: Locator for waiting for the Accessibility Setting page to be visible.
  DisableKeybordShortcutButton: Locator for disabling keyboard shortcuts.
  AccessiblePageSaveButton: Locator for the save button on the Accessibility Setting page.
  AnimationSettings: Locator for the "Animation" link.
  AnimationPageVisible: Locator for waiting for the Animation page to be visible.
  EnableDarkMode: Locator for enabling dark mode in Animation settings.
  WaitAnimationEffect: Locator for waiting for the Animation Effect label to be visible.
  AnimationEffectSelect: Locator for the dropdown in Animation settings.
  AnimationSaveButton: Locator for the save button on the Animation page.
  Method: switchsettingsControl()

• Performs a series of actions to control switch settings:
  Hovers over the Dark Mode settings menu.
  Waits for the "Settings" link to be visible.
  Clicks on the "Settings" link.
  Takes a screenshot before switching settings.
  Clicks on the "Switch Settings" link.
  Clicks on the floating switch style.
  Clicks on the "Custom" button.
  Selects an option from the dropdown.
  Takes a screenshot after switching settings according to the instruction.
  Clicks on the save button.
  Clicks on the "Accessibility Settings" link.
  Waits for the Accessibility Setting page to be visible.
  Clicks on the button to disable keyboard shortcuts.
  Takes a screenshot of accessible settings according to the instruction.
  Clicks on the save button on the Accessibility Setting page.
  Clicks on the "Animation" link.
  Waits for the Animation page to be visible.
  Clicks on the button to enable dark mode in Animation settings.
  Waits for the Animation Effect label to be visible.
  Selects an option from the Animation Effect dropdown.
  Takes a screenshot of animation settings according to the instruction.
  Clicks on the save button on the Animation page.

Execution Video:
https://drive.google.com/file/d/1Am36SQ8kiJrjKOQI1z2C_MX7r-IF2NCm/view?usp=drive_link

Settings operation methods following the 6 to 11 scenario:

package TestingMethodsAndPages;
import org.openqa.selenium.By;

public class SwitchSettings6to12 extends Methods{
	public By DMSETTINGSMENU = "//div[normalize-space()='WP Dark Mode']"
	public By WaitVisibleDMsettings = "//a[contains(text(),'Settings')]"
	public By SWITCHSETTINGS ="(//span[contains(text(),'Switch Settings')])[1]"
	public By WaitSwitchSettingPage = "(//span[contains(text(),'Switch Settings')])[2]"
	public By FloatingSwitchStyle = "(//img[@class='image-choose-img'])[16]"
	public By SwitchStyleCustomButton = "//span[normalize-space()='Custom']"
	//public By SwitchTo220 ="(//div[@class='ui-slider-range ui-corner-all ui-widget-header ui-slider-range-min'])[4]"
	public By SELECT = "(//select[@id='wp_dark_mode_switch[switcher_position]'])[1]"
	public By SAVEBUTTON ="(//input[@id='save_settings'])[4]"
	public By AccessibleSettings ="(//span[contains(text(),'Accessibility Settings')])[1]"
	public By AccesibleSettingPage = "(//h2)[10]"
	public By DisableKeybordShortcutButton ="(//div[@class='wp-dark-mode-ignore'])[23]"
	public By AccessiblePageSaveButton = "(//input[@id='save_settings'])[8]"
	public By AnimationSettings ="(//span[contains(text(),'Animation')])[1]"
	public By AnimationPageVisible ="//form[@method='post']//span[contains(text(),'Animation')]"
	public By EnableDarkMode ="(//div[@class='wp-dark-mode-ignore'])[30]"
	public By WaitAnimationEffect = "//label[normalize-space()='Animation Effect']"
	public By AnimationEffectSelect = "//select[contains(@id,'wp_dark_mode_animation')]"
	public By AnimationSaveButton ="(//input[@id='save_settings'])[13]"
	public void switchsettingsControl() throws InterruptedException{
		Hover(DMSETTINGSMENU
		WaitElementVisible(WaitVisibleDMsettings
		clickElement(WaitVisibleDMsettings
		Thread.sleep(2000
		WaitElementVisible(SWITCHSETTINGS
		takeScreenshot("Before Switch Settings"
		clickElement(SWITCHSETTINGS
		clickElement(FloatingSwitchStyle
		Thread.sleep(1000
		clickElement(SwitchStyleCustomButton
		Thread.sleep(3000
		//clickElement(SwitchTo220
		//Thread.sleep(1000
		DropDownSelectElement(SELECT
		Thread.sleep(1000
		takeScreenshot("After Switch Settings according to the instruction"
		clickElement(SAVEBUTTON
		Thread.sleep(2000
		clickElement(AccessibleSettings
		WaitElementVisible(AccesibleSettingPage
		clickElement(DisableKeybordShortcutButton
		Thread.sleep(4000
		takeScreenshot("Accessible Setting according to the instruction"
		clickElement(AccessiblePageSaveButton
		clickElement(AnimationSettings
		WaitElementVisible(AnimationPageVisible
		Thread.sleep(2000
		clickElement(EnableDarkMode
		Thread.sleep(4000
		WaitElementVisible(WaitAnimationEffect
		DropDownSelectElement(AnimationEffectSelect
		Thread.sleep(4000
		takeScreenshot("Animation setting according to the instruction"
		clickElement(AnimationSaveButton
	}
}

testSuite run:

package TestPages;

import org.testng.annotations.Test;
import TestingMethodsAndPages.SwitchSettings6to12;
import TestingMethodsAndPages.WordPressLoginPortal;
import Wppool.AssignmentWP.BrowserSetup;

public class Switch_Accessibility_AnimationSettings extends BrowserSetup{
	WordPressLoginPortal login = new WordPressLoginPortal(
	SwitchSettings6to12 settingsConfig = new SwitchSettings6to12(
	@Test(description = "Secenario 6 to 11")
	public void AllSettingsSecenario6to12() throws InterruptedException{
		getDriver().get("http://localhost/wordpress-6.3.1/wordpress/wp-admin"
		Thread.sleep(2000
		login.WordPressLogin(
		settingsConfig.switchsettingsControl(
		login.Hover(login.SAKIF
		login.clickElement(login.LOGOUT
		
	}
}

Scenario 12: Validate whether the Darkmode is working or not from the Frontend. Dedicated Xpath:

To validate whether darkmode is working or not, check the visit site by xpath, then when the site page appears, use the wait element to see whether the desired site page appears or not. When it appears, inspect the visible darkmode switch, and by clicking the switch, it will validate the changes executed by that switch, which leads to darkmode validation.

This class contain methods related to validating dark mode on a site. Here's a brief overview of the class:

• Element Locators:
  VISITSITEWPPOOL: Locator for the "WPPOOL" link.
  SITEPAGEVISIT: Locator for visiting a site page.
  DARKMODESWITCH: Locator for the dark mode switch.
  Method: BackendDarkmode()

• Performs a series of actions to validate dark mode on the site:
  Clicks on the "WPPOOL" link.
  Waits for the site page to be visible.
  Clicks on the dark mode switch three times with delays between clicks.
  Darkmode Switch Validation image:
  

Scenario 12 Execution video: https://drive.google.com/file/d/1xsKYCgyvGtaSixTuGYHdVJcKod1u1Xbl/view?usp=drive_link

Dark mode working objects

package TestingMethodsAndPages;
import org.openqa.selenium.By;

public class DarkModeValidation extends Methods {
	public By VISITSITEWPPOOL = By.xpath("//a[normalize-space()='WPPOOL']");
	public By SITEPAGEVISIT = By.xpath("(//p[@class='wp-block-site-title'])[1]");
	public By DARKMODESWITCH = By.xpath("//label[@for='wp-dark-mode-switch']");
	public void BackendDarkmode() throws InterruptedException{
		clickElement(VISITSITEWPPOOL);
		WaitElementVisible(SITEPAGEVISIT);
		clickElement(DARKMODESWITCH);
		Thread.sleep(2000);
		clickElement(DARKMODESWITCH);
		Thread.sleep(2000);
		clickElement(DARKMODESWITCH);
		Thread.sleep(2000);	
	}
}

Dark mode validation testSuite[Run as TestNG]

package TestPages;

import org.testng.annotations.Test;

import TestingMethodsAndPages.DarkModeValidation;
import TestingMethodsAndPages.WordPressLoginPortal;
import Wppool.AssignmentWP.BrowserSetup;

public class BackendDarkModeValidation extends BrowserSetup{
	WordPressLoginPortal login = new WordPressLoginPortal();
	DarkModeValidation DMV = new DarkModeValidation();
	
	@Test(description = "Dark Mode Validation")
	public void DarkModeValidationBackEnd() throws InterruptedException{
		getDriver().get("http://localhost/wordpress-6.3.1/wordpress/wp-admin");
		Thread.sleep(2000);
		login.WordPressLogin();
		DMV.BackendDarkmode();
		DMV.takeScreenshot("Dark Mode Switch Working");
		login.Hover(login.SAKIF);
		login.clickElement(login.LOGOUT);
	}
}

Automation of Scenario 1 to 12 Togather

Execution video for reference: https://drive.google.com/file/d/1s9aqVHH1KHOfTLRNIgbcT02dc4eeuP4F/view?usp=drive_link

To run the whole test scenario togather: By convert the whole test run files to TestNG -instruction image

-After clicking Convert to TestNG click on finish option

-Now you can ovserve a Testng.xml file under pom.xml file and run that file to see whole testing procedure togather

Allure Report Creation

To create an allure report, first set dependency in the pom.xml file.
io.qameta.allure allure-testng 2.19.0 2. then run the testing.xml file
3. then refresh the whole package and see a "allure-results" file created under Maven Dependencies
-before refresh

-after runing the testng.xml file and refresh the whole package allure reasult appear

4. To get allure report open the whole package terminal

5. then write in terminal to clean previous files> ""allure generate ./allure-result --clean""

6. then write in terminal to create allure report> ""allure open ./allure-report""

7. terminal gives us http to show us an allure report file directory
   Terminal image(5,6,7):
   

8. Create some methods for allure report (like allure ScreenShot) which is added already

9. method add:

public void takeScreenshot(String name) {
		Allure.addAttachment(name, new ByteArrayInputStream(((TakesScreenshot)getDriver()).getScreenshotAs(OutputType.BYTES)));
	}

Allure report file

file link: http://192.168.0.4:58373/
File generation instruction video: https://drive.google.com/file/d/1NXQ0IShmoAQHU3SiEziYfoiopfQ3AKXX/view?usp=drive_link

report overview:

Login to Dashbord Page Report:

Plugin installation report:

Scenario 4 & 5 page Report:

Settings (6-11) page report:

Dark Moda validate report:

Total Report graph: