lukas/OpenMediaCenter
1
0
Fork 0
Code Issues 8 Pull Requests Actions Packages Projects Releases Wiki Activity

fix some tests

Browse Source 
fix merge issues
This commit is contained in:
Lukas Heiligenbrunner
2020-12-29 19:39:30 +00:00
parent e11f021efe
commit 80a04456e6
74 changed files with 8067 additions and 4481 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/elements/Popups/AddActorPopup/AddActorPopup.module.css
View File

@ -1,11 +1,11 @@
.newactorbutton {
background-color: green;
border-radius: 5px;
border-width: 0;
color: white;
margin-right: 15px;
margin-top: 12px;
padding: 6px;
background-color: green;
width: 140px;
width: 140px;
}

18
src/elements/Popups/AddActorPopup/AddActorPopup.test.js
View File

@ -40,12 +40,12 @@ describe('<AddActorPopup/>', function () {
it('simulate actortile click', function () {
const func = jest.fn();
const wrapper = shallow(<AddActorPopup onHide={() => {func()}}/>);
const wrapper = shallow(<AddActorPopup onHide={() => {func();}} movie_id={1}/>);
global.callAPIMock({result: 'success'});
wrapper.setState({actors: [{id: 1, actorname: 'test'}]}, () => {
wrapper.find('ActorTile').props().onClick();
wrapper.setState({actors: [{actor_id: 1, actorname: 'test'}]}, () => {
wrapper.find('ActorTile').dive().simulate('click');
expect(callAPI).toHaveBeenCalledTimes(1);
@ -55,12 +55,12 @@ describe('<AddActorPopup/>', function () {
it('test failing actortile click', function () {
const func = jest.fn();
const wrapper = shallow(<AddActorPopup onHide={() => {func()}}/>);
const wrapper = shallow(<AddActorPopup onHide={() => {func();}}/>);
global.callAPIMock({result: 'nosuccess'});
wrapper.setState({actors: [{id: 1, actorname: 'test'}]}, () => {
wrapper.find('ActorTile').props().onClick();
wrapper.setState({actors: [{actor_id: 1, actorname: 'test'}]}, () => {
wrapper.find('ActorTile').dive().simulate('click');
expect(callAPI).toHaveBeenCalledTimes(1);
@ -68,4 +68,10 @@ describe('<AddActorPopup/>', function () {
expect(func).toHaveBeenCalledTimes(0);
});
});
it('test no actor on loading', function () {
const wrapper = shallow(<AddActorPopup/>);
expect(wrapper.find('PopupBase').find('ActorTile')).toHaveLength(0);
});
});

46
src/elements/Popups/AddActorPopup/AddActorPopup.js → src/elements/Popups/AddActorPopup/AddActorPopup.tsx
View File

@ -4,37 +4,51 @@ import ActorTile from '../../ActorTile/ActorTile';
import style from './AddActorPopup.module.css';
import {NewActorPopupContent} from '../NewActorPopup/NewActorPopup';
import {callAPI} from '../../../utils/Api';
import {ActorType} from '../../../api/VideoTypes';
import {GeneralSuccess} from '../../../api/GeneralTypes';
interface props {
onHide: () => void;
movie_id: number;
}
interface state {
contentDefault: boolean;
actors: ActorType[];
}
/**
* Popup for Adding a new Actor to a Video
*/
class AddActorPopup extends React.Component {
constructor(props) {
class AddActorPopup extends React.Component<props, state> {
constructor(props: props) {
super(props);
this.state = {
contentDefault: true,
actors: undefined
actors: []
};
this.tileClickHandler = this.tileClickHandler.bind(this);
}
render() {
render(): JSX.Element {
return (
<>
{/* todo render actor tiles here and add search field*/}
<PopupBase title='Add new Actor to Video' onHide={this.props.onHide} banner={
<button
className={style.newactorbutton}
onClick={() => {this.setState({contentDefault: false});}}>Create new Actor</button>}>
onClick={(): void => {
this.setState({contentDefault: false});
}}>Create new Actor</button>}>
{this.resolvePage()}
</PopupBase>
</>
);
}
componentDidMount() {
componentDidMount(): void {
// fetch the available actors
this.loadActors();
}
@ -43,9 +57,9 @@ class AddActorPopup extends React.Component {
* selector for current showing popup page
* @returns {JSX.Element}
*/
resolvePage() {
resolvePage(): JSX.Element {
if (this.state.contentDefault) return (this.getContent());
else return (<NewActorPopupContent onHide={() => {
else return (<NewActorPopupContent onHide={(): void => {
this.loadActors();
this.setState({contentDefault: true});
}}/>);
@ -55,8 +69,8 @@ class AddActorPopup extends React.Component {
* returns content for the newActor popup
* @returns {JSX.Element}
*/
getContent() {
if (this.state.actors) {
getContent(): JSX.Element {
if (this.state.actors.length !== 0) {
return (<div>
{this.state.actors.map((el) => (<ActorTile actor={el} onClick={this.tileClickHandler}/>))}
</div>);
@ -68,9 +82,13 @@ class AddActorPopup extends React.Component {
/**
* event handling for ActorTile Click
*/
tileClickHandler(actorid) {
tileClickHandler(actor: ActorType): void {
// fetch the available actors
callAPI('actor.php', {action: 'addActorToVideo', actorid: actorid, videoid: this.props.movie_id}, result => {
callAPI<GeneralSuccess>('actor.php', {
action: 'addActorToVideo',
actorid: actor.actor_id,
videoid: this.props.movie_id
}, result => {
if (result.result === 'success') {
// return back to player page
this.props.onHide();
@ -81,8 +99,8 @@ class AddActorPopup extends React.Component {
});
}
loadActors() {
callAPI('actor.php', {action: 'getAllActors'}, result => {
loadActors(): void {
callAPI<ActorType[]>('actor.php', {action: 'getAllActors'}, result => {
this.setState({actors: result});
});
}

8
src/elements/Popups/AddTagPopup/AddTagPopup.js
View File

@ -15,6 +15,7 @@ class AddTagPopup extends React.Component {
componentDidMount() {
callAPI('tags.php', {action: 'getAllTags'}, (result) => {
console.log(result);
this.setState({
items: result
});
@ -26,9 +27,10 @@ class AddTagPopup extends React.Component {
<PopupBase title='Add a Tag to this Video:' onHide={this.props.onHide}>
{this.state.items ?
this.state.items.map((i) => (
<Tag onclick={() => {
this.addTag(i.tag_id, i.tag_name);
}}>{i.tag_name}</Tag>
<Tag tagInfo={i}
onclick={() => {
this.addTag(i.tag_id, i.tag_name);
}}/>
)) : null}
</PopupBase>
);

4
src/elements/Popups/AddTagPopup/AddTagPopup.test.js
View File

@ -34,7 +34,7 @@ describe('<AddTagPopup/>', function () {
});
it('test addtag', done => {
const wrapper = shallow(<AddTagPopup/>);
const wrapper = shallow(<AddTagPopup movie_id={1}/>);
global.fetch = prepareFetchApi({result: 'success'});
@ -57,7 +57,7 @@ describe('<AddTagPopup/>', function () {
});
it('test failing addTag', done => {
const wrapper = shallow(<AddTagPopup/>);
const wrapper = shallow(<AddTagPopup movie_id={1}/>);
global.fetch = prepareFetchApi({result: 'fail'});

2
src/elements/Popups/NewActorPopup/NewActorPopup.test.js
View File

@ -22,7 +22,7 @@ describe('<NewActorPopupContent/>', () => {
global.callAPIMock({});
const func = jest.fn();
const wrapper = shallow(<NewActorPopupContent onHide={() => {func()}}/>);
const wrapper = shallow(<NewActorPopupContent onHide={() => {func();}}/>);
// manually set typed in actorname
wrapper.instance().value = 'testactorname';

27
src/elements/Popups/NewActorPopup/NewActorPopup.js → src/elements/Popups/NewActorPopup/NewActorPopup.tsx
View File

@ -2,12 +2,17 @@ import React from 'react';
import PopupBase from '../PopupBase';
import style from './NewActorPopup.module.css';
import {callAPI} from '../../../utils/Api';
import {GeneralSuccess} from '../../../api/GeneralTypes';
interface NewActorPopupProps {
onHide: () => void;
}
/**
* creates modal overlay to define a new Tag
*/
class NewActorPopup extends React.Component {
render() {
class NewActorPopup extends React.Component<NewActorPopupProps> {
render(): JSX.Element {
return (
<PopupBase title='Add new Tag' onHide={this.props.onHide} height='200px' width='400px'>
<NewActorPopupContent onHide={this.props.onHide}/>
@ -16,21 +21,17 @@ class NewActorPopup extends React.Component {
}
}
export class NewActorPopupContent extends React.Component {
constructor(props, context) {
super(props, context);
export class NewActorPopupContent extends React.Component<NewActorPopupProps> {
value: string | undefined;
this.props = props;
}
render() {
render(): JSX.Element {
return (
<>
<div>
<input type='text' placeholder='Actor Name' onChange={(v) => {
<input type='text' placeholder='Actor Name' onChange={(v): void => {
this.value = v.target.value;
}}/></div>
<button className={style.savebtn} onClick={() => this.storeselection()}>Save</button>
<button className={style.savebtn} onClick={(): void => this.storeselection()}>Save</button>
</>
);
}
@ -38,11 +39,11 @@ export class NewActorPopupContent extends React.Component {
/**
* store the filled in form to the backend
*/
storeselection() {
storeselection(): void {
// check if user typed in name
if (this.value === '' || this.value === undefined) return;
callAPI('actor.php', {action: 'createActor', actorname: this.value}, (result) => {
callAPI('actor.php', {action: 'createActor', actorname: this.value}, (result: GeneralSuccess) => {
if (result.result !== 'success') {
console.log('error occured while writing to db -- todo error handling');
console.log(result.result);

4
src/elements/Popups/NewTagPopup/NewTagPopup.test.js
View File

@ -3,8 +3,6 @@ import React from 'react';
import {shallow} from 'enzyme';
import '@testing-library/jest-dom';
import NewTagPopup from './NewTagPopup';
import {NoBackendConnectionPopup} from '../NoBackendConnectionPopup/NoBackendConnectionPopup';
import {getBackendDomain} from '../../../utils/Api';
describe('<NewTagPopup/>', function () {
it('renders without crashing ', function () {
@ -24,6 +22,8 @@ describe('<NewTagPopup/>', function () {
}
});
wrapper.instance().value = 'testvalue';
wrapper.find('button').simulate('click');
expect(global.fetch).toHaveBeenCalledTimes(1);

12
src/elements/Popups/NoBackendConnectionPopup/NoBackendConnectionPopup.tsx
View File

@ -1,7 +1,7 @@
import React from "react";
import PopupBase from "../PopupBase";
import style from "../NewActorPopup/NewActorPopup.module.css";
import {setCustomBackendDomain} from "../../../utils/Api";
import React from 'react';
import PopupBase from '../PopupBase';
import style from '../NewActorPopup/NewActorPopup.module.css';
import {setCustomBackendDomain} from '../../../utils/Api';
interface NBCProps {
onHide: (_: void) => void
@ -11,10 +11,10 @@ export function NoBackendConnectionPopup(props: NBCProps): JSX.Element {
return (
<PopupBase title='No connection to backend API!' onHide={props.onHide} height='200px' width='600px'>
<div>
<input type='text' placeholder='http://192.168.0.2' onChange={(v) => {
<input type='text' placeholder='http://192.168.0.2' onChange={(v): void => {
setCustomBackendDomain(v.target.value);
}}/></div>
<button className={style.savebtn} onClick={() => props.onHide()}>Refresh</button>
<button className={style.savebtn} onClick={(): void => props.onHide()}>Refresh</button>
</PopupBase>
);
}

2
src/elements/Popups/PopupBase.js
View File

@ -85,7 +85,7 @@ class PopupBase extends React.Component {
let xOld = 0, yOld = 0;
const elmnt = this.wrapperRef.current;
if(elmnt === null) return;
if (elmnt === null) return;
elmnt.firstChild.onmousedown = dragMouseDown;

10
src/elements/Popups/PopupBase.module.css
View File

@ -1,9 +1,9 @@
.popup {
border: 3px #3574fe solid;
border-radius: 18px;
min-height: 80%;
height: fit-content;
left: 20%;
min-height: 80%;
opacity: 0.95;
position: absolute;
top: 10%;
@ -11,7 +11,7 @@
z-index: 2;
}
.header{
.header {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
@ -20,20 +20,20 @@
.title {
cursor: move;
float: left;
font-size: x-large;
margin-left: 15px;
margin-top: 10px;
opacity: 1;
float: left;
width: 60%;
}
.banner {
width: 40%;
float: left;
display: flex;
flex-direction: row;
float: left;
justify-content: flex-end;
width: 40%;
}
.content {

6
src/elements/Popups/PopupBase.test.js
View File

@ -1,6 +1,6 @@
import {shallow} from "enzyme";
import React from "react";
import PopupBase from "./PopupBase";
import {shallow} from 'enzyme';
import React from 'react';
import PopupBase from './PopupBase';
describe('<PopupBase/>', function () {
it('renders without crashing ', function () {