-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #87 from OudomMunint/dev
PR: Dev => Main
- Loading branch information
Showing
7 changed files
with
142 additions
and
57 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -13,21 +13,28 @@ jobs: | |
| steps: | ||
| - name: Checkout PROD | ||
| uses: actions/checkout@v4 | ||
|
|
||
| - name: Install Node.js latest | ||
| uses: actions/setup-node@v4 | ||
| with: | ||
| node-version: latest | ||
| check-latest: true | ||
|
|
||
| - name: Install dependencies | ||
| run: npm ci | ||
|
|
||
| - name: Run ESLint | ||
| run: npx eslint --no-error-on-unmatched-pattern . | ||
| run: npx eslint --no-error-on-unmatched-pattern. | ||
|
|
||
| - name: Run all tests | ||
| run: npm run test | ||
|
|
||
| - name: Generate build | ||
| env: | ||
| CI: false | ||
| run: npm run build | ||
|
|
||
| # Share artifact inside workflow | ||
| # Share artifact | ||
| - name: Share artifact inside workflow | ||
| uses: actions/upload-artifact@v4 | ||
| with: | ||
|
|
@@ -38,4 +45,4 @@ jobs: | |
| uses: ncipollo/[email protected] | ||
| with: | ||
| artifacts: "react-github-actions-build" | ||
| tag: v1.5.4.7 | ||
| tag: v1.5.5 | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,57 @@ | ||
| import { render, screen } from '@testing-library/react'; | ||
| import App from './App'; | ||
| import ContactForm from './components/Contact'; | ||
| import reportWebVitals from "./reportWebVitals"; | ||
| import About from './components/About/About'; | ||
|
|
||
| test('renders learn react link', () => { | ||
| // Test home page content | ||
| test('Test home page content', () => { | ||
| render(<App />); | ||
| const linkElement = screen.getByText(/learn react/i); | ||
| expect(linkElement).toBeInTheDocument(); | ||
| const linkElement1 = screen.getByText(/Welcome!/i); | ||
| const linkElement2 = screen.getByText(/We are/i); | ||
| const linkElements3 = screen.getAllByText(/Studio Zed/i); | ||
|
|
||
| expect(linkElement1).toBeInTheDocument(); | ||
| expect(linkElement2).toBeInTheDocument(); | ||
| expect(linkElements3.length).toBeGreaterThan(0); // If atleast 1 match. | ||
| }); | ||
|
|
||
| // Test contact form | ||
| test('Find contact form', async () => { | ||
| render(<ContactForm />); | ||
| const formTitle = await screen.findByText(/Get in touch!/i); | ||
| const formFieldName = await screen.findByPlaceholderText(/Name/i); | ||
| const formFieldEmail = await screen.findByPlaceholderText(/Email/i); | ||
| const formFieldMessage = await screen.findByPlaceholderText(/Message/i); | ||
|
|
||
| expect(formTitle).toBeInTheDocument(); | ||
| expect(formFieldName).toBeInTheDocument(); | ||
| expect(formFieldEmail).toBeInTheDocument(); | ||
| expect(formFieldMessage).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| // Test form submit button | ||
| test('Find form submit button', () => { | ||
| render(<ContactForm />); | ||
| const submitButton = screen.getByRole('button', { name: /Submit/i }); | ||
| expect(submitButton).toBeInTheDocument(); | ||
| }); | ||
|
|
||
| // Test web vitals | ||
| test('Test web vitals', () => { | ||
| reportWebVitals(metric => { | ||
| console.log('Web Vitals metric:', metric); | ||
| expect(metric).toBeDefined(); | ||
| expect(metric.name).toBeTruthy(); | ||
| }); | ||
| }); | ||
|
|
||
| // Test if about page is rendered | ||
| test('Test AboutPage', () => { | ||
| render(<About />); | ||
| const aboutPage = About(); | ||
| if (aboutPage != null) { | ||
| console.log("About page is rendered"); | ||
| } | ||
| expect(aboutPage).not.toBeNull(); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,44 +1,45 @@ | ||
| import React, { useState } from "react"; | ||
| import React, { useState, useEffect, useCallback } from "react"; | ||
|
|
||
| function ContactForm() { | ||
| const isDevelopment = process.env.NODE_ENV === "development"; | ||
| const [name, setName] = useState(""); | ||
| const [email, setEmail] = useState(""); | ||
| const [message, setMessage] = useState(""); | ||
|
|
||
| const handleSubmit = async (event) => { | ||
| const handleSubmit = useCallback(async (event) => { | ||
| event.preventDefault(); | ||
| let data = { name, email, message }; | ||
| try { | ||
| // clear form | ||
| setName(''); | ||
| setEmail(''); | ||
| setMessage(''); | ||
| data = { name: "testUser1", email: "[email protected]", message: "Hello, this is a test message." }; | ||
| console.log('Form submission successful:'); | ||
| console.log(data); | ||
| if (isDevelopment) { | ||
| data = { | ||
| name: "testUser1", | ||
| email: "[email protected]", | ||
| message: "Hello, this is a test message." | ||
| }; | ||
| } | ||
| console.log('Form submission successful:', data); | ||
| } catch (error) { | ||
| console.error('Form submission error:', error); | ||
| console.log('Error caught'); | ||
| } | ||
| }; | ||
| }, [name, email, message, isDevelopment]); | ||
|
|
||
| if (isDevelopment) { | ||
| try { | ||
| document.getElementsByClassName("submit").addEventListener("click", handleSubmit); | ||
| } | ||
| catch (error) { | ||
| console.error('Error:', error); | ||
| } | ||
| } | ||
| else { | ||
| try { | ||
| document.getElementsByClassName("submit").removeEventListener("click", handleSubmit); | ||
| } | ||
| catch (error) { | ||
| console.error('Error:', error); | ||
| useEffect(() => { | ||
| if (isDevelopment) { | ||
| const button = document.querySelector(".submit"); | ||
| if (button) { | ||
| button.addEventListener("click", handleSubmit); | ||
| } | ||
| return () => { | ||
| if (button) { | ||
| button.removeEventListener("click", handleSubmit); | ||
| } | ||
| }; | ||
| } | ||
| } | ||
| }, [isDevelopment, handleSubmit]); | ||
|
|
||
| return ( | ||
| <> | ||
|
|
@@ -84,7 +85,7 @@ function ContactForm() { | |
| </div> | ||
| <div data-netlify-recaptcha="true" className="reCaptcha"></div> | ||
| {/* Submit */} | ||
| <button className="btn btn-danger submit" type="submit" style={{ position: "relative", marginTop: "68px" }}> | ||
| <button title="submit" className="btn btn-danger submit" type="submit" style={{ position: "relative", marginTop: "68px" }}> | ||
| Submit | ||
| </button> | ||
| </form> | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,14 +1,20 @@ | ||
| //Web vitals! Do not remove! | ||
| // Web vitals | ||
| const reportWebVitals = onPerfEntry => { | ||
| if (onPerfEntry && onPerfEntry instanceof Function) { | ||
| import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { | ||
| getCLS(onPerfEntry); | ||
| getFID(onPerfEntry); | ||
| getFCP(onPerfEntry); | ||
| getLCP(onPerfEntry); | ||
| getTTFB(onPerfEntry); | ||
| }); | ||
| import('web-vitals') | ||
| .then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { | ||
| try { | ||
| getCLS(onPerfEntry); | ||
| getFID(onPerfEntry); | ||
| getFCP(onPerfEntry); | ||
| getLCP(onPerfEntry); | ||
| getTTFB(onPerfEntry); | ||
| } catch (error) { | ||
| console.error('Error collecting Web Vitals:', error); | ||
| } | ||
| }) | ||
| .catch(error => console.error('Error loading Web Vitals library:', error)); | ||
| } | ||
| }; | ||
|
|
||
| export default reportWebVitals; | ||
| export default reportWebVitals; |