feat: ajusta coisas em testes ds

This commit is contained in:
marlon passos 2023-03-29 11:53:36 -03:00
parent bb09045019
commit daf98b26a1
8 changed files with 66 additions and 28 deletions

View File

@ -7,8 +7,9 @@ interface LiProps extends NavLinkProps {
to: string;
}
const LiForm = (props: LiProps) => {
const { text, to } = props;
const LiForm = ({ text, to }: LiProps) => {
console.log(geDataTestId(to));
return (
<li>
<NavLink
@ -27,9 +28,10 @@ const LiForm = (props: LiProps) => {
};
function geDataTestId(url: string ) {
return "lateralMenu__item" + (isCurrentUrl()) ? "lateralMenu__itemActive" : "";
return `lateralMenu__item${isTextUrl() ? " lateralMenu__itemActive" : ""}`;
function isCurrentUrl() {
function isTextUrl() {
return window.location.href.includes(url);
}
}

View File

@ -15,7 +15,7 @@ const Nav = () => {
data-testid="lateralMenu__container"
>
<ul className={styles["page-subject__menu"]}>
<LiForm to="/" text="Sobre" />
<LiForm to="/Sobre" text="Sobre" />
<LiForm to="/forma-de-pagamento" text="Forma de Pagamento" />
<LiForm to="/entrega" text="Entrega" />
<LiForm to="/troca-e-devolucao" text="Troca e Devolução" />

View File

@ -15,7 +15,7 @@ const SubjectMain = () => {
<Router>
<Nav />
<Routes>
<Route path="/" element={<Sobre />} />
<Route path="/sobre" element={<Sobre />} />
<Route path="/forma-de-pagamento" element={<FormaDePagamento />} />
<Route path="/entrega" element={<Entrega />} />
<Route path="/troca-e-devolucao" element={<TrocaEDevolucao />} />

View File

@ -4,15 +4,17 @@ import styles from "../footer/footer.module.scss";
interface ButtonProps {
text: string;
testId?: string;
}
const Button = (props: ButtonProps) => {
const { text } = props;
return (
<button type="submit" className={styles["button"]}>
{props.text}
const Button = ({ text, testId }: ButtonProps) => (
<button
type="submit"
className={styles["button"]}
data-testid={testId}
>
{text}
</button>
);
};
export { Button };

View File

@ -6,13 +6,15 @@ import { Imgs } from "./pagamento/imgs";
import styles from "../footer.module.scss";
const FooterBottom = () => {
return (
<section className={styles["page-footer__footer-bottom"]}>
<section
className={styles["page-footer__footer-bottom"]}
data-testid="footer__bottom"
>
<div className={styles["page-footer__footer-bottom-container"]}>
<section className={styles["page-footer__container-footer-text"]}>
<Text
className={styles["page-footer__footer-text"]}
text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor"
text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tecmpor"
/>
</section>
<Imgs />

View File

@ -11,9 +11,15 @@ const Institucional = () => {
setIsOpen(!isOpen);
};
return (
<section className={styles["page-footer__container"]}>
<section
data-testid="footer__menuTitle"
className={styles["page-footer__container"]}>
<div className={styles["container-title"]} onClick={handleMenuFooter}>
<Title className={styles["title"]} text="INSTITUCIONAL" />
<Title
className={styles["title"]}
text="INSTITUCIONAL"
testId="footer__menuTitle"
/>
<ButtonFooterMobile
className={
isOpen ? styles["link-mobile-active"] : styles["link-mobile"]
@ -22,13 +28,22 @@ const Institucional = () => {
</div>
<div className={isOpen ? styles["active"] : styles["container-link"]}>
<Link className={styles["link"]} link="/" text="Quem Somos" />
<Link
data-testid="footer__menuItem"
className={styles["link"]}
link="/"
text="Quem Somos"
/>
<Link
className={styles["link"]}
link="/"
text="Política de Privacidade"
/>
<Link className={styles["link"]} link="/" text="Segurança" />
<Link
className={styles["link"]}
link="/"
text="Segurança"
/>
<Link
className={styles["link-underline"]}
link="/"

View File

@ -1,11 +1,16 @@
export interface TitleProps {
text: string;
className: string;
testId?: string
}
const Title = (props: TitleProps) => {
const { text, className } = props;
return <h3 className={className}>{text}</h3>;
const Title = ({ text, className, testId }: TitleProps) => {
return <h3
className={className}
data-testid={testId}
>
{text}
</h3>;
};
export { Title };

View File

@ -16,14 +16,14 @@ const initialValues = {
const Newsletter = () => {
const [isSubmit, setIsSubmit] = useState(false);
return (
<section className={styles["page-footer__newsletter"]}>
<section
data-testid="newsletter__container"
className={styles["page-footer__newsletter"]}
>
<div className={styles["page-footer__newsletter-container"]}>
<h3 className={styles["page-footer__newsletter-title"]}>
ASSINE NOSSA NEWSLETTER
</h3>
<Title />
<Formik
onSubmit={(values: FormikValues, { resetForm }) => {
console.log(values);
setIsSubmit(!isSubmit);
resetForm({ values: initialValues });
}}
@ -34,6 +34,7 @@ const Newsletter = () => {
<div className={styles["page-footer__newsletter-form"]}>
<Field
name="email"
test-testid="newsletter__input"
className={styles["input"]}
placeholder="E-mail"
/>
@ -43,7 +44,7 @@ const Newsletter = () => {
className={styles["page-footer__newsletter-error"]}
/>
</div>
<Button text="ENVIAR" />
<Button text="ENVIAR" testId="newsletter__submit" />
</Form>
</Formik>
</div>
@ -52,3 +53,14 @@ const Newsletter = () => {
};
export { Newsletter };
export const Title = () => {
return (
<h3
className={styles["page-footer__newsletter-title"]}
data-testid="newsletter__title"
>
ASSINE NOSSA NEWSLETTER
</h3>
)
}