Skip to content

Commit

Permalink
fix: remove usage of node built-ins
Browse files Browse the repository at this point in the history
  • Loading branch information
spaenleh committed Jul 22, 2022
1 parent dc18114 commit add0d6c
Show file tree
Hide file tree
Showing 17 changed files with 177 additions and 94 deletions.
1 change: 1 addition & 0 deletions .eslintrc
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@
// disable the rule for all files
"@typescript-eslint/explicit-function-return-type": "off",
"no-use-before-define": 0,
"@typescript-eslint/no-namespace": "off",
"@typescript-eslint/no-use-before-define": ["error"],
"react/jsx-uses-react": "off",
"react/react-in-jsx-scope": "off"
Expand Down
15 changes: 15 additions & 0 deletions cypress.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import { defineConfig } from 'cypress';

export default defineConfig({
chromeWebSecurity: false,
video: false,

component: {
devServer: {
framework: 'create-react-app',
bundler: 'webpack',
},
viewportWidth: 290,
viewportHeight: 800,
},
});
11 changes: 0 additions & 11 deletions cypress.json

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,27 +1,22 @@
/// <reference types="./cypress"/>
import { List } from 'immutable';

import { mount } from '@cypress/react';

import {
CHAT_ID,
CHAT_MESSAGES,
spyMethod,
} from '../../cypress/fixtures/chat_messages';
import { MEMBERS } from '../../cypress/fixtures/members';
import Chatbox from '../components/Chatbox/Chatbox';
import { ImmutableMember, Member } from '../../src';
import Chatbox from '../../src/components/Chatbox/Chatbox';
import {
adminToolsContainerCypress,
cancelDialogButtonCypress,
clearChatButtonCypress,
confirmDialogButtonCypress,
dataCyWrapper,
exportChatButtonCypress,
} from '../config/selectors';
import { ImmutableMember, Member } from '../types';
import { verifyDownloadedChat } from './utils/utils';
} from '../../src/config/selectors';
import { verifyDownloadedChat } from '../../src/test/utils/utils';
import { CHAT_ID, CHAT_MESSAGES, spyMethod } from '../fixtures/chat_messages';
import { MEMBERS } from '../fixtures/members';

const mountChatbox = (showTools: boolean, emptyData = false): void => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down Expand Up @@ -73,7 +68,7 @@ describe('Admin tools', () => {

it('should show clear chat button', () => {
const clearChatSpy = spyMethod('clearChatSpy');
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down
13 changes: 13 additions & 0 deletions cypress/integration/cypress.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import { mount } from 'cypress/react';

// Augment the Cypress namespace to include type definitions for
// your custom command.
// Alternatively, can be defined in cypress/support/component.d.ts
// with a <reference path="./component" /> at the top of your spec.
declare global {
namespace Cypress {
interface Chainable {
mount: typeof mount;
}
}
}
Original file line number Diff line number Diff line change
@@ -1,14 +1,8 @@
/// <reference types="./cypress"/>
import { List } from 'immutable';

import { mount } from '@cypress/react';

import {
CHAT_ID,
CHAT_MESSAGES,
spyMethod,
} from '../../cypress/fixtures/chat_messages';
import { CURRENT_MEMBER, MEMBERS } from '../../cypress/fixtures/members';
import Chatbox from '../components/Chatbox/Chatbox';
import { ImmutableMember, Member } from '../../src';
import Chatbox from '../../src/components/Chatbox/Chatbox';
import {
dataCyWrapper,
deleteMenuItemCypress,
Expand All @@ -18,13 +12,14 @@ import {
editMenuItemCypress,
inputTextFieldTextAreaCypress,
messageActionsButtonCypress,
} from '../config/selectors';
import { SIDE_PANE_HEIGHT, SIDE_PANE_WIDTH } from '../constants';
import { ImmutableMember, Member } from '../types';
} from '../../src/config/selectors';
import { SIDE_PANE_HEIGHT, SIDE_PANE_WIDTH } from '../../src/constants';
import { CHAT_ID, CHAT_MESSAGES, spyMethod } from '../fixtures/chat_messages';
import { CURRENT_MEMBER, MEMBERS } from '../fixtures/members';

describe('Message actions', () => {
beforeEach(() => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -50,7 +45,7 @@ describe('Message actions', () => {
describe('Delete action', () => {
it('should delete message', () => {
const deleteMessageSpy = spyMethod('spyMethod');
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -74,7 +69,7 @@ describe('Edit action', () => {
cy.viewport(SIDE_PANE_WIDTH, SIDE_PANE_HEIGHT);
const editMessageSpy = spyMethod('editSpyMethod');
const sendMessageSpy = spyMethod('sendSpyMethod');
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,24 +1,23 @@
/// <reference types="./cypress"/>
import { List } from 'immutable';
import { v4 } from 'uuid';

import { mount } from '@cypress/react';

import { CHAT_ID, CHAT_MESSAGES } from '../../cypress/fixtures/chat_messages';
import { MEMBERS } from '../../cypress/fixtures/members';
import { mockUseAvatar } from '../../cypress/fixtures/mockHooks';
import Chatbox from '../components/Chatbox/Chatbox';
import { ImmutableMember, Member } from '../../src';
import Chatbox from '../../src/components/Chatbox/Chatbox';
import {
dataCyWrapper,
exportChatButtonCypress,
inputTextFieldTextAreaCypress,
messageIdCyWrapper,
messagesContainerCypress,
} from '../config/selectors';
import { ImmutableMember, Member } from '../types';
} from '../../src/config/selectors';
import { CHAT_ID, CHAT_MESSAGES } from '../fixtures/chat_messages';
import { MEMBERS } from '../fixtures/members';
import { mockUseAvatar } from '../fixtures/mockHooks';

describe('Render Avatar', () => {
beforeEach(() => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -30,7 +29,7 @@ describe('Render Avatar', () => {

it('should call avatar hook', () => {
const { hook: fakeHook, name: fakeHookName } = mockUseAvatar();
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -45,7 +44,7 @@ describe('Render Avatar', () => {

describe('Autofocus input field', () => {
it('should autofocus input field on first render', () => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -62,7 +61,7 @@ describe('Messages container', () => {
it('should scroll when there are a lot of messages', () => {
const firstId = v4();
const lastId = v4();
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down Expand Up @@ -92,7 +91,7 @@ describe('Messages container', () => {

describe('Export Chat button', () => {
it('should show export button', () => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -106,7 +105,7 @@ describe('Export Chat button', () => {
});

it('should not show button when chat is empty', () => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -119,7 +118,7 @@ describe('Export Chat button', () => {
});

it('should not show export button', () => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,29 +1,28 @@
/// <reference types="./cypress"/>
import { List } from 'immutable';

import { mount } from '@cypress/react';

import {
CHAT_ID,
CHAT_MESSAGES,
LONG_COMMENT,
SHORT_COMMENT,
spyMethod,
} from '../../cypress/fixtures/chat_messages';
import { MEMBERS } from '../../cypress/fixtures/members';
import Chatbox from '../components/Chatbox/Chatbox';
import { ImmutableMember, Member } from '../../src';
import Chatbox from '../../src/components/Chatbox/Chatbox';
import {
charCounterCypress,
dataCyWrapper,
inputTextFieldCypress,
inputTextFieldTextAreaCypress,
sendButtonCypress,
} from '../config/selectors';
import { HARD_MAX_MESSAGE_LENGTH } from '../constants';
import { ImmutableMember, Member } from '../index';
} from '../../src/config/selectors';
import { HARD_MAX_MESSAGE_LENGTH } from '../../src/constants';
import {
CHAT_ID,
CHAT_MESSAGES,
LONG_COMMENT,
SHORT_COMMENT,
spyMethod,
} from '../fixtures/chat_messages';
import { MEMBERS } from '../fixtures/members';

describe('Enter text', () => {
beforeEach(() => {
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down Expand Up @@ -54,7 +53,7 @@ describe('Send message', () => {
it('should send a message with click', () => {
const inputText = 'Hello there';
const sendMessageSpy = spyMethod('spyMethod');
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -71,7 +70,7 @@ describe('Send message', () => {
it('should send a message with enter', function () {
const inputText = 'Hello there';
const sendMessageSpy = spyMethod('spyMethod');
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand All @@ -91,7 +90,7 @@ describe('Message Length', () => {
let sendMessageSpy;
beforeEach(() => {
sendMessageSpy = spyMethod('spyMethod');
mount(
cy.mount(
<Chatbox
chatId={CHAT_ID}
currentMember={new ImmutableMember(MEMBERS.ANNA)}
Expand Down
38 changes: 38 additions & 0 deletions cypress/support/commands.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add('login', (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
//
// declare global {
// namespace Cypress {
// interface Chainable {
// login(email: string, password: string): Chainable<void>
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
// }
// }
// }
export {};
12 changes: 12 additions & 0 deletions cypress/support/component-index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Components App</title>
</head>
<body>
<div data-cy-root></div>
</body>
</html>
37 changes: 37 additions & 0 deletions cypress/support/component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
// ***********************************************************
// This example support/component.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************
// Import commands.js using ES2015 syntax:
// Alternatively you can use CommonJS syntax:
// require('./commands')
import { mount } from 'cypress/react';

import './commands';

// Augment the Cypress namespace to include type definitions for
// your custom command.
// Alternatively, can be defined in cypress/support/component.d.ts
// with a <reference path="./component" /> at the top of your spec.
declare global {
namespace Cypress {
interface Chainable {
mount: typeof mount;
}
}
}

Cypress.Commands.add('mount', mount);

// Example use:
// cy.mount(<MyComponent />)
Loading

0 comments on commit add0d6c

Please sign in to comment.