Merge branch 'main' into feature/add-ids-and-classes

diff --git a/src/shared/components/app/footer.tsx b/src/shared/components/app/footer.tsx
index bd66165e13761fd0389410a89b7f7273a0105f9e..d9ae173d7b93c57b2b9f32d940a65bbf7ac16e9e 100644 (file)
--- a/src/shared/components/app/footer.tsx
+++ b/src/shared/components/app/footer.tsx
@@ -16,7 +16,10 @@ export class Footer extends Component<FooterProps, any> {
 
   render() {
     return (
-      <nav className="container-lg navbar navbar-expand-md navbar-light navbar-bg p-3">
+      <nav
+        id="footer"
+        className="container-lg navbar navbar-expand-md navbar-light navbar-bg p-3"
+      >
         <div className="navbar-collapse">
           <ul className="navbar-nav ml-auto">
             {this.props.site?.version !== VERSION && (

diff --git a/src/shared/components/app/navbar.tsx b/src/shared/components/app/navbar.tsx
index 6d310eef36d3b10455638700192f4efd3aa630a7..4afe2e19c79d6d7cc6c516cb5e774cc546da40a9 100644 (file)
--- a/src/shared/components/app/navbar.tsx
+++ b/src/shared/components/app/navbar.tsx
@@ -86,8 +86,12 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
     const siteView = this.props.siteRes?.site_view;
     const person = UserService.Instance.myUserInfo?.local_user_view.person;
     return (
-      <nav className="navbar navbar-expand-md navbar-light shadow-sm p-0 px-3 container-lg">
+      <nav
+        className="navbar navbar-expand-md navbar-light shadow-sm p-0 px-3 container-lg"
+        id="navbar"
+      >
         <NavLink
+          id="navTitle"
           to="/"
           title={siteView?.site.description ?? siteView?.site.name}
           className="d-flex align-items-center navbar-brand mr-md-3"
@@ -100,10 +104,10 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
         </NavLink>
         {person && (
           <ul className="navbar-nav d-flex flex-row ml-auto d-md-none">
-            <li className="nav-item">
+            <li className="nav-item nav-item-icon">
               <NavLink
                 to="/inbox"
-                className="p-1 nav-link border-0"
+                className="p-1 nav-link border-0 nav-messages"
                 title={i18n.t("unread_messages", {
                   count: Number(this.state.unreadApplicationCountRes.state),
                   formattedCount: numToSI(this.unreadInboxCount),
@@ -119,7 +123,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
               </NavLink>
             </li>
             {this.moderatesSomething && (
-              <li className="nav-item">
+              <li className="nav-item nav-item-icon">
                 <NavLink
                   to="/reports"
                   className="p-1 nav-link border-0"
@@ -139,7 +143,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
               </li>
             )}
             {amAdmin() && (
-              <li className="nav-item">
+              <li className="nav-item nav-item-icon">
                 <NavLink
                   to="/registration_applications"
                   className="p-1 nav-link border-0"
@@ -178,7 +182,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
           id="navbarDropdown"
           ref={this.mobileMenuRef}
         >
-          <ul className="mr-auto navbar-nav">
+          <ul id="navbarLinks" className="mr-auto navbar-nav">
             <li className="nav-item">
               <NavLink
                 to="/communities"
@@ -228,8 +232,8 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
               </a>
             </li>
           </ul>
-          <ul className="navbar-nav">
-            <li className="nav-item">
+          <ul id="navbarIcons" className="navbar-nav">
+            <li className="nav-item nav-item-search">
               <NavLink
                 to="/search"
                 className="nav-link"
@@ -240,7 +244,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
               </NavLink>
             </li>
             {amAdmin() && (
-              <li className="nav-item">
+              <li className="nav-item nav-item-admin">
                 <NavLink
                   to="/admin"
                   className="nav-link"
@@ -253,7 +257,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
             )}
             {person ? (
               <>
-                <li className="nav-item">
+                <li className="nav-item nav-item-messages">
                   <NavLink
                     className="nav-link"
                     to="/inbox"
@@ -272,7 +276,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
                   </NavLink>
                 </li>
                 {this.moderatesSomething && (
-                  <li className="nav-item">
+                  <li className="nav-item nav-item-moderation">
                     <NavLink
                       className="nav-link"
                       to="/reports"
@@ -292,7 +296,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
                   </li>
                 )}
                 {amAdmin() && (
-                  <li className="nav-item">
+                  <li className="nav-item nav-item-applications">
                     <NavLink
                       to="/registration_applications"
                       className="nav-link"
@@ -312,7 +316,7 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
                   </li>
                 )}
                 {person && (
-                  <div className="dropdown">
+                  <div id="dropdownUser" className="dropdown">
                     <button
                       className="btn dropdown-toggle"
                       role="button"

diff --git a/src/shared/components/comment/comment-form.tsx b/src/shared/components/comment/comment-form.tsx
index c60cde20161407905dd8f3ad977423e60c94392d..7e4aa9febfc45424e0b83544d624017321c6374b 100644 (file)
--- a/src/shared/components/comment/comment-form.tsx
+++ b/src/shared/components/comment/comment-form.tsx
@@ -21,6 +21,7 @@ interface CommentFormProps {
   onReplyCancel?(): void;
   allLanguages: Language[];
   siteLanguages: number[];
+  containerClass?: string;
   onUpsertComment(form: EditComment | CreateComment): void;
 }
 
@@ -40,7 +41,7 @@ export class CommentForm extends Component<CommentFormProps, any> {
         : undefined;
 
     return (
-      <div className="mb-3">
+      <div className={["mb-3", this.props.containerClass].join(" ")}>
         {UserService.Instance.myUserInfo ? (
           <MarkdownTextArea
             initialContent={initialContent}

diff --git a/src/shared/components/comment/comment-node.tsx b/src/shared/components/comment/comment-node.tsx
index 0380a72663935e8f119e309d1e5dc159723f3d7c..9ebbf3482004d2b2b47a9396c19f9d7dc2b10121 100644 (file)
--- a/src/shared/components/comment/comment-node.tsx
+++ b/src/shared/components/comment/comment-node.tsx
@@ -400,6 +400,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
                 focus
                 allLanguages={this.props.allLanguages}
                 siteLanguages={this.props.siteLanguages}
+                containerClass="comment-comment-container"
                 onUpsertComment={this.props.onEditComment}
               />
             )}
@@ -1143,6 +1144,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
             focus
             allLanguages={this.props.allLanguages}
             siteLanguages={this.props.siteLanguages}
+            containerClass="comment-comment-container"
             onUpsertComment={this.props.onCreateComment}
           />
         )}

diff --git a/src/shared/components/common/markdown-textarea.tsx b/src/shared/components/common/markdown-textarea.tsx
index a4459ac0236dfef97de988603172a9f05763cc78..a3a9cbde61d624eb370fb425447723ade8bb3444 100644 (file)
--- a/src/shared/components/common/markdown-textarea.tsx
+++ b/src/shared/components/common/markdown-textarea.tsx
@@ -63,8 +63,9 @@ export class MarkdownTextArea extends Component<
   MarkdownTextAreaProps,
   MarkdownTextAreaState
 > {
-  private id = `comment-textarea-${randomStr()}`;
-  private formId = `comment-form-${randomStr()}`;
+  private id = `markdown-textarea-${randomStr()}`;
+  private formId = `markdown-form-${randomStr()}`;
+
   private tribute: any;
 
   state: MarkdownTextAreaState = {

diff --git a/src/shared/components/community/sidebar.tsx b/src/shared/components/community/sidebar.tsx
index 57400f484819b5d0d62aa98ee6625c4be9b3ffd4..0d08e77e1ac9c32c93038038474413891c7beb83 100644 (file)
--- a/src/shared/components/community/sidebar.tsx
+++ b/src/shared/components/community/sidebar.tsx
@@ -132,8 +132,8 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
     const myUSerInfo = UserService.Instance.myUserInfo;
     const { name, actor_id } = this.props.community_view.community;
     return (
-      <div>
-        <div className="card border-secondary mb-3">
+      <div id="sidebarContainer">
+        <div id="sidebarMain" className="card border-secondary mb-3">
           <div className="card-body">
             {this.communityTitle()}
             {this.props.editable && this.adminButtons()}
@@ -155,7 +155,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
             )}
           </div>
         </div>
-        <div className="card border-secondary mb-3">
+        <div id="sidebarInfo" className="card border-secondary mb-3">
           <div className="card-body">
             {this.description()}
             {this.badges()}

diff --git a/src/shared/components/home/home.tsx b/src/shared/components/home/home.tsx
index 1abb1ee329f391ab52e93e1c33d389e173ddf834..9c7cd753defe55c61f92226fe1617ef68c9c2608 100644 (file)
--- a/src/shared/components/home/home.tsx
+++ b/src/shared/components/home/home.tsx
@@ -423,8 +423,8 @@ export class Home extends Component<any, HomeState> {
 
     return (
       <div>
-        <div>
-          <div className="card border-secondary mb-3">
+        <div id="sidebarContainer">
+          <div id="sidebarMain" className="card border-secondary mb-3">
             <div className="card-body">
               {this.trendingCommunities()}
               {canCreateCommunity(this.state.siteRes) && (
@@ -447,7 +447,7 @@ export class Home extends Component<any, HomeState> {
             showLocal={showLocal(this.isoData)}
           />
           {this.hasFollows && (
-            <div className="card border-secondary mb-3">
+            <div id="sidebarSubscribed" className="card border-secondary mb-3">
               <div className="card-body">{this.subscribedCommunities}</div>
             </div>
           )}

diff --git a/src/shared/components/home/site-sidebar.tsx b/src/shared/components/home/site-sidebar.tsx
index 051c3afd480c3d0676ecf176dde3ca919c0b3abd..d96a1381dc8575afad92efe935aa73a198d830c3 100644 (file)
--- a/src/shared/components/home/site-sidebar.tsx
+++ b/src/shared/components/home/site-sidebar.tsx
@@ -30,7 +30,7 @@ export class SiteSidebar extends Component<SiteSidebarProps, SiteSidebarState> {
 
   render() {
     return (
-      <div className="card border-secondary mb-3">
+      <div id="sidebarInfo" className="card border-secondary mb-3">
         <div className="card-body">
           <div>
             <div className="mb-2">{this.siteName()}</div>

diff --git a/src/shared/components/post/create-post.tsx b/src/shared/components/post/create-post.tsx
index c7597917740486cd58eae285e54232887737b893..baa7b45ff3f778f3815af9853f24787889e9722c 100644 (file)
--- a/src/shared/components/post/create-post.tsx
+++ b/src/shared/components/post/create-post.tsx
@@ -166,7 +166,10 @@ export class CreatePost extends Component<
           </h5>
         ) : (
           <div className="row">
-            <div className="col-12 col-lg-6 offset-lg-3 mb-4">
+            <div
+              id="createPostForm"
+              className="col-12 col-lg-6 offset-lg-3 mb-4"
+            >
               <h5>{i18n.t("create_post")}</h5>
               <PostForm
                 onCreate={this.handlePostCreate}

diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx
index 60e188a33b77c942ba5e9f33cdceb29a8e07e6bb..23ae3892b4c2d706e0fd15acd03b06eb38307571 100644 (file)
--- a/src/shared/components/post/post-listing.tsx
+++ b/src/shared/components/post/post-listing.tsx
@@ -230,7 +230,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
   body() {
     const body = this.postView.post.body;
     return body ? (
-      <div className="col-12 card my-2 p-2">
+      <div id="postContent" className="col-12 card my-2 p-2">
         {this.state.viewSource ? (
           <pre>{body}</pre>
         ) : (
@@ -464,7 +464,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
         </button>
         {showScores() ? (
           <div
-            className={`unselectable pointer font-weight-bold text-muted px-1`}
+            className={`unselectable pointer font-weight-bold text-muted px-1 post-score`}
             data-tippy-content={this.pointsTippy}
           >
             {numToSI(this.postView.counts.score)}
@@ -1398,7 +1398,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
       <>
         {/* The mobile view*/}
         <div className="d-block d-sm-none">
-          <div className="row">
+          <div className="row post-container">
             <div className="col-12">
               {this.createdLine()}
 
@@ -1418,9 +1418,9 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
 
         {/* The larger view*/}
         <div className="d-none d-sm-block">
-          <div className="row">
+          <div className="row post-container">
             {!this.props.viewOnly && this.voteBar()}
-            <div className="col-sm-2 pr-0">
+            <div className="col-sm-2 pr-0 post-media">
               <div className="">{this.thumbnail()}</div>
             </div>
             <div className="col-12 col-sm-9">

diff --git a/src/shared/components/post/post.tsx b/src/shared/components/post/post.tsx
index 51365803490cef2da1bb7956c004e8a2211227da..dadebcf9a8689c20878dc8ad4320a27c4d6b6203 100644 (file)
--- a/src/shared/components/post/post.tsx
+++ b/src/shared/components/post/post.tsx
@@ -384,6 +384,7 @@ export class Post extends Component<any, PostState> {
                 disabled={res.post_view.post.locked}
                 allLanguages={this.state.siteRes.all_languages}
                 siteLanguages={this.state.siteRes.discussion_languages}
+                containerClass="post-comment-container"
                 onUpsertComment={this.handleCreateComment}
                 finished={this.state.finished.get(0)}
               />