Fixing e2e and login screen (#481)

.github/workflows/alpha.yml

@@ -2,7 +2,7 @@ name: 'Alpha Build'
 
 on:
   push:
-    branches: [v5000/twitter]
+    branches: [v5000/last-updates]
 
 jobs:
   frontend:

frontend/src/App.tsx

@@ -13,7 +13,6 @@ import { RecoilRoot } from 'recoil';
 import { Suspense } from 'react';
 import { CodeSplitLoader } from './CodeSplitLoader';
 import QuotaManager from './auth/QuotaManager';
-import GlobalProvider from './global/GlobalProvider';
 import { ConfirmProvider } from 'material-ui-confirm';
 
 function App() {
@@ -39,20 +38,18 @@ function App() {
           <ThemeProvider theme={theme}>
             <ConfirmProvider>
               <BrowserRouter>
-                <GlobalProvider>
-                  <AuthProvider>
-                    <LanguageProvider>
-                      <QuotaManager>
-                        <Global styles={globalCss} />
-                        <ErrorBoundary>
-                          <Suspense fallback={<CodeSplitLoader />}>
-                            <Layout />
-                          </Suspense>
-                        </ErrorBoundary>
-                      </QuotaManager>
-                    </LanguageProvider>
-                  </AuthProvider>
-                </GlobalProvider>
+                <AuthProvider>
+                  <LanguageProvider>
+                    <QuotaManager>
+                      <Global styles={globalCss} />
+                      <ErrorBoundary>
+                        <Suspense fallback={<CodeSplitLoader />}>
+                          <Layout />
+                        </Suspense>
+                      </ErrorBoundary>
+                    </QuotaManager>
+                  </LanguageProvider>
+                </AuthProvider>
               </BrowserRouter>
             </ConfirmProvider>
           </ThemeProvider>

frontend/src/global/state.ts

@@ -1,23 +1,32 @@
-import { atom } from 'recoil';
+import { selector } from 'recoil';
 import { BackendCapabilities } from 'common';
+import { fetchBackendCapabilities } from 'api';
 
-export const backendCapabilitiesState = atom<BackendCapabilities>({
+export const backendCapabilitiesState = selector<BackendCapabilities>({
   key: 'BACKEND_CAPABILITIES',
-  default: {
-    adminEmail: '',
-    licenced: true,
-    selfHosted: false,
-    disableAnonymous: false,
-    disablePasswords: false,
-    disablePasswordRegistration: false,
-    oAuth: {
-      google: false,
-      github: false,
-      twitter: false,
-      microsoft: false,
-      slack: false,
-      okta: false,
-    },
-    emailAvailable: false,
+  get: async () => {
+    const data = await fetchBackendCapabilities();
+
+    if (data) {
+      return data;
+    }
+
+    return {
+      adminEmail: '',
+      licenced: true,
+      selfHosted: false,
+      disableAnonymous: false,
+      disablePasswords: false,
+      disablePasswordRegistration: false,
+      oAuth: {
+        google: false,
+        github: false,
+        twitter: false,
+        microsoft: false,
+        slack: false,
+        okta: false,
+      },
+      emailAvailable: false,
+    };
   },
 });

frontend/src/views/Welcome.tsx

@@ -22,6 +22,9 @@ const Container = styled.div`
 `;
 
 const Title = styled.h1`
+  margin-left: 40px;
+  margin-right: 40px;
+  text-align: center;
   font-weight: 100;
   font-size: 4em;
   @media screen and (max-width: 700px) {

integration/cypress.config.js

@@ -2,7 +2,7 @@ const { defineConfig } = require('cypress')
 
 module.exports = defineConfig({
   env: {
-    backend_delay: 0,
+    backend_delay: 2000,
   },
   e2e: {
     // We've imported your old cypress plugins here.

integration/cypress/e2e/test.cy.js

@@ -1,6 +1,8 @@
 describe('Home Page', () => {
   it('Should load correctly', () => {
     cy.visit('/');
+
+    cy.wait(+Cypress.env('backend_delay'));
 
     cy.get('#content').get('h1').should('contain', 'Welcome!');
   });
@@ -39,13 +41,17 @@ describe('Post workflow', () => {
     // Reload the page
     cy.reload();
 
+    cy.wait(+Cypress.env('backend_delay'));
+
     // The post should still be there
     cy.get('#content').should('contain', 'Slava Ukraini!');
   });
 
   it('Should change language and translate the app', () => {
     cy.visit('/');
 
+    cy.wait(+Cypress.env('backend_delay'));
+
     // Close cookie banner
     cy.get('.wpcc-btn').click();
 
@@ -79,6 +85,8 @@ describe('Post workflow', () => {
 
       cy.visit('/');
 
+      cy.wait(+Cypress.env('backend_delay'));
+
       // Close cookie banner
       cy.get('.wpcc-btn').click();
 
@@ -119,6 +127,8 @@ describe('Post workflow', () => {
 
       cy.visit('/');
 
+      cy.wait(+Cypress.env('backend_delay'));
+
       // Close cookie banner
       cy.get('.wpcc-btn').click();
 
@@ -136,6 +146,8 @@ describe('Post workflow', () => {
       // Register
       get('register-button').click();
 
+      cy.wait(+Cypress.env('backend_delay'));
+
       // Go to the user admin and delete the account
       get('account-menu').click();
       get('account-menu-account').click();

integration/docker-compose.ci.alpha.yml

@@ -7,7 +7,7 @@ services:
       - frontend
     environment:
       - CYPRESS_baseUrl=http://frontend
-      - CYPRESS_backend_delay=30000
+      - CYPRESS_backend_delay=10000
     working_dir: /e2e
     volumes:
       - ./:/e2e

integration/docker-compose.ci.canary.yml

@@ -7,7 +7,7 @@ services:
       - frontend
     environment:
       - CYPRESS_baseUrl=http://frontend
-      - CYPRESS_backend_delay=30000
+      - CYPRESS_backend_delay=10000
     working_dir: /e2e
     volumes:
       - ./:/e2e

integration/docker-compose.ci.master.yml

@@ -7,7 +7,7 @@ services:
       - frontend
     environment:
       - CYPRESS_baseUrl=http://frontend
-      - CYPRESS_backend_delay=30000
+      - CYPRESS_backend_delay=10000
     working_dir: /e2e
     volumes:
       - ./:/e2e