How to create a Maven project for a Java application using IntelliJ IDEA, specifically set up for Test-Driven Development (TDD) with Selenium. This guide includes a practical example of implementing and refactoring a "Hello World" application using Spring Boot for the backend and Angular for the frontend.

This guide provides detailed instructions on setting up a Java Maven project in IntelliJ IDEA, configured for Test-Driven Development (TDD) with Selenium, using a Spring Boot and Angular "Hello World" example.

1. Creating a Maven Project
2. Configuring the Project Structure
3. Adding Dependencies
4. Implementing TDD with Selenium
5. Example Implementation and Refactoring

Step 1: Open IntelliJ IDEA

• Launch IntelliJ IDEA and navigate to File > New > Project.

Step 2: Configure the New Project

• Select Maven from the options on the left.
• Confirm the JDK for the project (e.g., JDK 17).
• Click Next.

Step 3: Set Project Details

• Enter the GroupId (e.g., com.example).
• Enter the ArtifactId (e.g., demo).
• Specify the version and provide a project name and description.
• Click Next.

Step 4: Choose Project Location

• Select a directory for your project.
• Click Finish to create the project.

Your initial project structure should resemble the following:

demo/
|-- src/
    |-- main/
        |-- java/
            |-- com/example/demo/
        |-- resources/
    |-- test/
        |-- java/
            |-- com/example/demo/
|-- target/
|-- pom.xml

Edit your pom.xml to include Spring Boot and Selenium for backend and frontend testing:

<dependencies>
    <!-- Spring Boot Starter Web for REST services -->
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>

    <!-- Selenium WebDriver for browser-based testing -->
    <dependency>
        <groupId>org.seleniumhq.selenium</groupId>
        <artifactId>selenium-java</artifactId>
        <version>4.3.0</version>
        <scope>test</scope>
    </dependency>

    <!-- JUnit for unit testing -->
    <dependency>
        <groupId>junit</groupId>
        <artifactId>junit</artifactId>
        <version>4.13.2</version>
        <scope>test</scope>
    </dependency>
</dependencies>

Step 1: Create a Test Class

• In src/test/java/com/example/demo, create a test class HelloWorldSeleniumTest.

Step 2: Write Initial Failing Tests

• Implement a Selenium test to check the display of "Hello World":

public class HelloWorldSeleniumTest {
    private WebDriver driver;

    @Before
    public void setUp() {
        System.setProperty("webdriver.chrome.driver", "/path/to/chromedriver");
        driver = new ChromeDriver();
    }

    @After
    public void tearDown() {
        if (driver != null) {
            driver.quit();
        }
    }

    @Test
    public void testHelloWorldMessage() {
        driver.get("http://localhost:4200");
        assertEquals("Hello World", driver.findElement(By.tagName("h1")).getText());
    }
}

Initial Implementation

• Develop the Spring Boot and Angular code to display "Hello World".
• Ensure the test passes by running the Angular app (ng serve) and Spring Boot app.

Refactoring

• Refactor the backend to return a JSON object and update the frontend to handle it:

Spring Boot Code Before Refactoring:

@GetMapping("/hello")
public String sayHello() {
    return "Hello World";
}

After Refactoring:

@GetMapping("/hello")
public ResponseEntity<Map<String, Object>> sayHello() {
    Map<String, Object> response = new HashMap<>();
    response.put("message", "Hello World");
    return ResponseEntity.ok(response);
}

Angular Frontend Update:

this.http.get<{message: string}>('http://localhost:8080/hello').subscribe(data => {
    this.message = data.message;
});