# Selenium Page Objects

> **Note:**
> Selenium Page Object support in IntelliJ IDEA is provided by the [Test Automation](https://plugins.jetbrains.com/plugin/20175-test-automation) plugin. If the relevant features are not available, make sure that the plugin is [installed and enabled](ui-test-automation.html#install_test_automation_plugin).

Page Object is a design pattern in Selenium that establishes an object repository for storing web elements. Its purpose is to minimize code repetition and enhance the maintainability of test cases.

The typical workflow starts with creating a Page Object class for the web page you are going to test. This Page Object class is then populated with locators and methods for interacting with the elements on that page. Once the Page Object is set up, you can reference these methods in your test scripts to perform actions on the web page.

## Create a Page Object

Procedure:

> **Note:**
> Prior to creating a Page Object, make sure that Selenium libraries are added to the classpath. Otherwise, the functionality will not be available.

1. In the Project tool window, right-click the directory where you want to store the Page Object and select `New | Selenium Page Object`.

2. Select the implementation language, framework, and give the Page Object a name.

3. (Optional) Provide a URL of the web page for which you are creating a Page Object.

![New Selenium Page Object](https://resources.jetbrains.com.cn/help/img/idea/2026.2/new_selenium_page_object.png)

> **Tip:**
> If configured, the specified web page will be opened in Web Inspector once the Page Object is created. You can then proceed to add the required elements to the Page Object.

4. (Optional) If needed, you can customize the Page Object template. For more information, refer to [Customize Page Object template](#customize_template).

5. Click OK.

As a result, a new Page Object is created.

## Add elements to the Page Object

Procedure:

1. Click ![the Web Inspector button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.webInspector%4020x20.svg) on the right-hand sidebar to open the Web Inspector toolbar window.

2. Specify the URL of the page in the address bar. This step is optional if you have provided the URL during the [previous step](#create_page_object).

![Address bar controls](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_address_bar_controls.png)

3. Click ![The Select Element in Page button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.browser.expui.selectWeb.svg) and select the element that you want to add to the Page Object in the Web Inspector.

![Select element in page](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_select_element_in_page.png)

4. Once the element is selected, click ![Add Element to Code](https://resources.jetbrains.com.cn/help/img/idea/2026.2/app.expui.general.add.svg) to add the element to the code.

![The Add Element to Code button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_add_element_to_code.png)

To add a specific type of the selector (ID, Name, Tag with classes, and so on), click ![Add Element to Code By](https://resources.jetbrains.com.cn/help/img/idea/2026.2/app-client.expui.general.chevronDownLarge.svg) and select the required option.

![Add elements to code by](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_add_elements_to_code_by.png)

If you want to switch specifically between CSS and XPath locators, click ![](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.locators.expui.css.svg) and select the required locator type.

![Select locator type](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_locator_type_switcher.png)

As a result, a piece of code is generated and added to the code editor. Repeat the steps to populate the Page Object with other elements.

## Change URL in an existing Page Object

If you want to specify a different web page URL for the Page Object, update the page address in the `// page_url` comment.

![Editing the Page Object](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_edit_page_object.png)

> **Tip:**
> For FluentLenium, use the `@PageUrl` annotation.

## Customize Page Object template

If you want to customize the default contents of the Page Object file (for example, import additional classes), modify the Page Object template:

Procedure:

1. Press `Ctrl+Alt+S` (Windows), `⌘ Comma` (macOS), `⌘ Comma` (IntelliJ IDEA Classic (macOS)), `⌘ Comma` (macOS System Shortcuts), `Ctrl+Alt+S` (XWin), `Ctrl+Alt+S` (GNOME), `Ctrl+Alt+S` (KDE), `Ctrl+Alt+S` (Emacs), `Ctrl+Alt+S` (Sublime Text), `⌘ Comma` (Sublime Text (macOS)), `Ctrl+Alt+S` (NetBeans), `Ctrl+Alt+S` (Visual Studio), `⌘ Comma` (Visual Studio (macOS)), `Ctrl+Alt+S` (Eclipse), `⌘ Comma` (Eclipse (macOS)), then select `Editor | File and Code Templates`.

![The File and Code Templates settings](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_file_and_code_templates.png)

2. Select the Other tab.

3. Click `Selenium | Page Object Templates | <Required language>`

4. Select the required Page Object template from the list.

![List of Page Object templates](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_selenium_page_object_template.png)

5. Modify the template.

> **Tip:**
> [Apache Velocity](https://velocity.apache.org/) template language is used.

6. Click Apply to save changes.

As a result, all newly created Page Objects will contain the provided changes.