Wrote end-to-end cypress tests

client/src/Project/Board/Filters/index.jsx

@@ -25,7 +25,7 @@ const ProjectBoardFilters = ({ projectUsers, defaultFilters, filters, mergeFilte
   const areFiltersCleared = !searchTerm && userIds.length === 0 && !myOnly && !recent;
 
   return (
-    <Filters>
+    <Filters data-testid="board-filters">
       <SearchInput
         icon="search"
         value={searchTerm}

client/src/Project/Board/IssueDetails/AssigneesReporter/index.jsx

@@ -25,6 +25,7 @@ const ProjectBoardIssueDetailsAssigneesReporter = ({ issue, updateIssue, project
         variant="empty"
         dropdownWidth={343}
         placeholder="Unassigned"
+        name="assignees"
         value={issue.userIds}
         options={userOptions}
         onChange={userIds => {
@@ -41,6 +42,7 @@ const ProjectBoardIssueDetailsAssigneesReporter = ({ issue, updateIssue, project
         variant="empty"
         dropdownWidth={343}
         withClearValue={false}
+        name="reporter"
         value={issue.reporterId}
         options={userOptions}
         onChange={userId => updateIssue({ reporterId: userId })}

client/src/Project/Board/IssueDetails/Comments/Comment/index.jsx

@@ -50,7 +50,7 @@ const ProjectBoardIssueDetailsComment = ({ comment, fetchIssue }) => {
   };
 
   return (
-    <Comment>
+    <Comment data-testid="issue-comment">
       <UserAvatar name={comment.user.name} avatarUrl={comment.user.avatarUrl} />
       <Content>
         <Username>{comment.user.name}</Username>
@@ -71,7 +71,7 @@ const ProjectBoardIssueDetailsComment = ({ comment, fetchIssue }) => {
             <ConfirmModal
               title="Are you sure you want to delete this comment?"
               message="Once you delete, it's gone for good."
-              confirmText="Delete Comment"
+              confirmText="Delete comment"
               onConfirm={handleCommentDelete}
               renderLink={modal => <DeleteLink onClick={modal.open}>Delete</DeleteLink>}
             />

client/src/Project/Board/IssueDetails/EstimateTracking/index.jsx

@@ -28,6 +28,7 @@ const ProjectBoardIssueDetailsEstimateTracking = ({ issue, updateIssue }) => (
 
     <SectionTitle>Time Tracking</SectionTitle>
     <Modal
+      testid="modal:tracking"
       width={400}
       renderLink={modal => (
         <TrackingLink onClick={modal.open}>

client/src/Project/Board/IssueDetails/Priority/index.jsx

@@ -19,6 +19,7 @@ const ProjectBoardIssueDetailsPriority = ({ issue, updateIssue }) => (
       variant="empty"
       withClearValue={false}
       dropdownWidth={343}
+      name="priority"
       value={issue.priority}
       options={Object.values(IssuePriority).map(priority => ({
         value: priority,

client/src/Project/Board/IssueDetails/Status/index.jsx

@@ -19,6 +19,7 @@ const ProjectBoardIssueDetailsStatus = ({ issue, updateIssue }) => (
       variant="empty"
       dropdownWidth={343}
       withClearValue={false}
+      name="status"
       value={issue.status}
       options={Object.values(IssueStatus).map(status => ({
         value: status,

client/src/Project/Board/IssueDetails/Type/index.jsx

@@ -16,6 +16,7 @@ const ProjectBoardIssueDetailsType = ({ issue, updateIssue }) => (
     variant="empty"
     dropdownWidth={150}
     withClearValue={false}
+    name="type"
     value={issue.type}
     options={Object.values(IssueType).map(type => ({
       value: type,

client/src/Project/Board/Lists/List/Issue/index.jsx

@@ -24,6 +24,7 @@ const ProjectBoardListIssue = ({ projectUsers, issue, index }) => {
         <IssueLink
           to={`${match.url}/issues/${issue.id}`}
           ref={provided.innerRef}
+          data-testid="list-issue"
           {...provided.draggableProps}
           {...provided.dragHandleProps}
         >

client/src/Project/Board/Lists/List/index.jsx

@@ -31,7 +31,11 @@ const ProjectBoardList = ({ status, project, filters }) => {
             {`${IssueStatusCopy[status]} `}
             <IssuesCount>{formatIssuesCount(allListIssues, filteredListIssues)}</IssuesCount>
           </Title>
-          <Issues {...provided.droppableProps} ref={provided.innerRef}>
+          <Issues
+            {...provided.droppableProps}
+            ref={provided.innerRef}
+            data-testid={`board-list:${status}`}
+          >
             {filteredListIssues.map((issue, index) => (
               <Issue key={issue.id} projectUsers={project.users} issue={issue} index={index} />
             ))}

client/src/Project/Board/index.jsx

@@ -49,6 +49,7 @@ const ProjectBoard = ({ project, fetchProject, updateLocalProjectIssues }) => {
         render={routeProps => (
           <Modal
             isOpen
+            testid="modal:issue-details"
             width={1040}
             withCloseIcon={false}
             onClose={() => history.push(match.url)}

client/src/Project/IssueCreate/index.jsx

@@ -30,7 +30,7 @@ const propTypes = {
   modalClose: PropTypes.func.isRequired,
 };
 
-const ProjectIssueCreateForm = ({ project, fetchProject, onCreate, modalClose }) => {
+const ProjectIssueCreate = ({ project, fetchProject, onCreate, modalClose }) => {
   const [{ isCreating }, createIssue] = useApi.post('/issues');
 
   const { currentUserId } = useCurrentUser();
@@ -168,6 +168,6 @@ const renderUser = project => ({ value: userId, removeOptionValue }) => {
   );
 };
 
-ProjectIssueCreateForm.propTypes = propTypes;
+ProjectIssueCreate.propTypes = propTypes;
 
-export default ProjectIssueCreateForm;
+export default ProjectIssueCreate;

client/src/Project/ProjectSettings/Styles.js

@@ -9,10 +9,11 @@ export const FormCont = styled.div`
 `;
 
 export const FormElement = styled(Form.Element)`
+  width: 100%;
   max-width: 640px;
 `;
 
-export const FormHeading = styled.div`
+export const FormHeading = styled.h1`
   padding: 6px 0 15px;
   ${font.size(24)}
   ${font.medium}

client/src/Project/index.jsx

@@ -10,7 +10,7 @@ import NavbarLeft from './NavbarLeft';
 import Sidebar from './Sidebar';
 import Board from './Board';
 import IssueSearch from './IssueSearch';
-import IssueCreateForm from './IssueCreateForm';
+import IssueCreate from './IssueCreate';
 import ProjectSettings from './ProjectSettings';
 import { ProjectPage } from './Styles';
 
@@ -49,6 +49,7 @@ const Project = () => {
       {issueSearchModalHelpers.isOpen() && (
         <Modal
           isOpen
+          testid="modal:issue-search"
           variant="aside"
           width={600}
           onClose={issueSearchModalHelpers.close}
@@ -59,11 +60,12 @@ const Project = () => {
       {issueCreateModalHelpers.isOpen() && (
         <Modal
           isOpen
+          testid="modal:issue-create"
           width={800}
           withCloseIcon={false}
           onClose={issueCreateModalHelpers.close}
           renderContent={modal => (
-            <IssueCreateForm
+            <IssueCreate
               project={project}
               fetchProject={fetchProject}
               onCreate={() => history.push(`${match.url}/board`)}