Home link.

Author: antonioalonzi

src/main/js/admin/Auth/Login/Login.js

@@ -47,6 +47,10 @@ export default function Login() {
     login('guest@matag.com', 'password')
   }
 
+  const handleRegister = () => {
+    navigate('/ui/auth/register')
+  }
+
   return (
     <section id='login'>
       <div id='login-container'>
@@ -67,6 +71,8 @@ export default function Login() {
               <input type='submit' value='Login' />
               <div className='or'>or</div>
               <input type='button' value='Login as Guest' onClick={handleLoginAsGuest} />
+              <div className='or'>or</div>
+              <input type='button' value='Register' onClick={handleRegister} />
             </div>
             {loading && <Loader center />}
           </div>

src/main/js/admin/Header/Header.js

@@ -17,8 +17,8 @@ export default function Header() {
   return (
     <header>
       <div id='logo'>
-        <img src={`${APP_BASE_PATH}/img/matag.png`} alt='matag-logo' />
-        <h1>{config.matagName}</h1>
+        <Link to="/"><img src={`${APP_BASE_PATH}/img/matag.png`} alt='matag-logo' /></Link>
+        <h1><Link to="/" className="unstyled-link">{config.matagName}</Link></h1>
       </div>
 
       <div id='menu-bar'>

src/main/js/admin/admin.scss

@@ -22,6 +22,12 @@ a {
   color: $link-text-color;
 }
 
+.unstyled-link {
+  text-decoration: none;
+  color: inherit;
+  cursor: pointer;
+}
+
 input,
 select,
 textarea,

src/test/js/Browser.js

@@ -1,4 +1,4 @@
-import {getNodeText, waitFor} from '@testing-library/react'
+import {waitFor} from '@testing-library/react'
 import HeaderSection from './admin/Header/HeaderSection'
 import IntroSection from './admin/Home/Intro/IntroSection'
 import StatsSection from './admin/Home/Stats/StatsSection'
@@ -21,7 +21,7 @@ export default class Browser {
   }
 
   async waitForTitleToBe(title) {
-    await waitFor(() => getNodeText(this.app.container.querySelector('h2')) === title)
+    await waitFor(() => this.app.container.querySelector('h2').textContent === title)
   }
 
   getHeader() {

src/test/js/admin/Header/HeaderSection.js

@@ -1,17 +1,15 @@
-import {getNodeText} from '@testing-library/react'
-
 export default class HeaderSection {
   constructor(element) {
     this.element = element
   }
 
   expectTitleToBeMatagTheGame() {
-    expect(getNodeText(this.element.querySelector('h1'))).toBe('Matag: The Game')
+    expect(this.element.querySelector('h1').textContent).toBe('Matag: The Game')
   }
 
   expectMenuItems(expectedItemsText) {
     const items = this.element.querySelectorAll('nav')
-    const itemsText = Array.from(items).map((item) => getNodeText(item.childNodes[0]))
+    const itemsText = Array.from(items).map((item) => item.childNodes[0].textContent)
     expect(itemsText).toEqual(expectedItemsText)
   }
 }

src/test/js/admin/Home/Intro/IntroSection.js

@@ -1,14 +1,12 @@
-import {getNodeText} from '@testing-library/react'
-
 export default class IntoSection {
   constructor(element) {
     this.element = element
   }
 
   validateAllLinks() {
     const links = this.element.querySelectorAll('a')
-    expect(getNodeText(links[0])).toBe('Matag: The Game')
-    expect(getNodeText(links[1])).toBe('matag.the.game@gmail.com')
-    expect(getNodeText(links[2])).toBe('Matag: The Game Discord Channel')
+    expect(links[0].textContent).toBe('Matag: The Game')
+    expect(links[1].textContent).toBe('matag.the.game@gmail.com')
+    expect(links[2].textContent).toBe('Matag: The Game Discord Channel')
   }
 }

src/test/js/admin/Home/Stats/StatsSection.js

@@ -1,5 +1,3 @@
-import {getNodeText} from '@testing-library/react'
-
 export default class StatsSection {
   constructor(element) {
     this.element = element
@@ -8,13 +6,13 @@ export default class StatsSection {
   validateStats(stats) {
     const lis = this.element.querySelectorAll('li')
     this.validateStat(lis[0], 'TOTAL USERS: ', stats.totalUsers.toString())
-    this.validateStat(lis[1], 'ONLINE USERS: ', stats.onlineUsers.length + ' ()')
+    this.validateStat(lis[1], 'ONLINE USERS: ', stats.onlineUsers.length + ' (' + stats.onlineUsers.join('') + ')')
     this.validateStat(lis[2], 'TOTAL CARDS: ', stats.totalCards.toString())
     this.validateStat(lis[3], 'TOTAL SETS: ', stats.totalSets + ' (from Magic Origins)')
   }
 
   validateStat(li, text, value) {
-    expect(getNodeText(li.childNodes[0].childNodes[0])).toBe(text)
-    expect(getNodeText(li.childNodes[1])).toBe(value)
+    expect(li.childNodes[0].childNodes[0].textContent).toBe(text)
+    expect(li.childNodes[1].textContent).toBe(value)
   }
 }

src/test/js/admin/Profile/ProfileSection.js

@@ -1,5 +1,3 @@
-import {getNodeText} from '@testing-library/react'
-
 export default class ProfileSection {
   constructor(element) {
     this.element = element
@@ -13,7 +11,7 @@ export default class ProfileSection {
   }
 
   validateField(dt, dd, expectedLabel, expectedValue) {
-    expect(getNodeText(dt)).toBe(expectedLabel)
-    expect(getNodeText(dd)).toBe(expectedValue)
+    expect(dt.textContent).toBe(expectedLabel)
+    expect(dd.textContent).toBe(expectedValue)
   }
 }

src/test/js/admin/utils/AbstractFormSection.js

@@ -1,4 +1,4 @@
-import {getNodeText, waitFor} from '@testing-library/react'
+import {waitFor} from '@testing-library/react'
 
 export default class AbstractFormSection {
   constructor(element) {
@@ -10,10 +10,10 @@ export default class AbstractFormSection {
   }
 
   getError() {
-    return getNodeText(this.element.querySelector('.error'))
+    return this.element.querySelector('.error').textContent
   }
 
   getMessage() {
-    return getNodeText(this.element.querySelector('.message'))
+    return this.element.querySelector('.message').textContent
   }
 }

src/test/js/admin/utils/TestUtils.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Provider } from 'react-redux'
 import {createStore} from 'redux'
-import {getNodeText, render} from '@testing-library/react'
+import {render} from '@testing-library/react'
 import AdminApp from 'admin/AdminApp'
 import history from 'admin/utils/history'
 import AppReducer from 'admin/_reducers/AppReducer'
@@ -45,7 +45,7 @@ export default class TestUtils {
   static rowAsStrings(row) {
     const tds = row.querySelectorAll('td')
     return Array.from(tds)
-      .map((td) => getNodeText(td))
+      .map((td) => td.textContent)
   }
 }