Fix broken Donate tests

Author: conorheffron

frontend/src/components/Donate.js

@@ -86,26 +86,45 @@ class Donate extends Component {
                 <Carousel className="App-header">
                     {donateItems.map((item, index) => (
                         <Carousel.Item key={index} interval={500}>
-                            <a href={item.donate} target="_blank" rel="noreferrer" onClick={() => trackClickOut('charity', item.donate)}>
-                                <img className="d-block w-100" src={red} alt={item.alt} />
-                                <Carousel.Caption>
-                                    <h1 className="mb-3">
-                                        <span style={{ textDecoration: 'underline' }}>{item.name}</span>
-                                    </h1>
-                                    <p>
-                                        <b>Contact & Help by Phone: </b><span dangerouslySetInnerHTML={{ __html: item.phone }} />
-                                    </p>
-                                    <p>
-                                        <b>Home page: </b><a href={item.link} target="_blank" rel="noreferrer" onClick={(event) => {
-                                            event.stopPropagation();
-                                            trackClickOut('charity', item.link);
-                                        }}>{item.link}</a>
-                                    </p>
-                                    <p className="overview-text">
-                                        <b>Overview:</b> Founded in {item.founded}, {item.overview}
-                                    </p>
-                                </Carousel.Caption>
-                            </a>
+                            <img className="d-block w-100" src={red} alt={item.alt} />
+
+                            <Carousel.Caption>
+                                <h1 className="mb-3">
+                                    <span style={{ textDecoration: 'underline' }}>{item.name}</span>
+                                </h1>
+
+                                <p>
+                                    <b>Contact & Help by Phone: </b>
+                                    <span dangerouslySetInnerHTML={{ __html: item.phone }} />
+                                </p>
+
+                                <p>
+                                    <b>Home page: </b>
+                                    <a
+                                        href={item.link}
+                                        target="_blank"
+                                        rel="noreferrer"
+                                        onClick={() => trackClickOut('charity', item.link)}
+                                    >
+                                        {item.link}
+                                    </a>
+                                </p>
+
+                                <p className="overview-text">
+                                    <b>Overview:</b> Founded in {item.founded}, {item.overview}
+                                </p>
+
+                                <p>
+                                    <a
+                                        href={item.donate}
+                                        target="_blank"
+                                        rel="noreferrer"
+                                        onClick={() => trackClickOut('charity', item.donate)}
+                                    >
+                                        Donate here
+                                    </a>
+                                </p>
+                            </Carousel.Caption>
                         </Carousel.Item>
                     ))}
                 </Carousel>

frontend/src/components/__tests__/Donate.test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, screen, waitFor } from '@testing-library/react';
+import { render, screen, waitFor, fireEvent } from '@testing-library/react';
 import { MockedProvider } from '@apollo/client/testing';
 import Donate, { GET_DONATE_ITEMS } from '../Donate';
 import '@testing-library/jest-dom';