correct load of categorypage on tag click

improved failing tests

src/elements/Tag/Tag.js

@@ -1,15 +1,9 @@
 import React from "react";
 
 import "./Tag.css"
-import VideoContainer from "../VideoContainer/VideoContainer";
+import CategoryPage from "../../pages/CategoryPage/CategoryPage";
 
 class Tag extends React.Component {
-    constructor(props, context) {
-        super(props, context);
-
-        this.props = props;
-    }
-
     render() {
         return (
             <button className='tagbtn' onClick={() => this.TagClick()}
@@ -20,23 +14,10 @@ class Tag extends React.Component {
     TagClick() {
         const tag = this.props.children.toString().toLowerCase();
 
-        const updateRequest = new FormData();
-        updateRequest.append('action', 'getMovies');
-        updateRequest.append('tag', tag);
-
-        // fetch all videos available
-        fetch('/api/videoload.php', {method: 'POST', body: updateRequest})
-            .then((response) => response.json()
-                .then((result) => {
-                    this.props.contentbinding(
-                        <VideoContainer
-                            data={result}
-                            viewbinding={this.props.viewbinding}/>, tag
-                    );
-                }))
-            .catch(() => {
-                console.log("no connection to backend");
-            });
+        this.props.viewbinding.changeRootElement(
+            <CategoryPage
+                category={tag}
+                viewbinding={this.props.viewbinding}/>);
     }
 }
 

src/elements/Tag/Tag.test.js

@@ -23,21 +23,20 @@ describe('<Tag/>', function () {
         expect(wrapper.children().text()).toBe("test");
     });
 
-    it('click event triggered and setvideo callback called', done => {
+    it('click event triggered and setvideo callback called', function () {
         global.fetch = prepareFetchApi({});
         const func = jest.fn();
+        const elem = {
+            changeRootElement: () => func()
+        };
 
         const wrapper = shallow(<Tag
-            contentbinding={func}>test</Tag>);
+            viewbinding={elem}>test</Tag>);
+
+        expect(func).toBeCalledTimes(0);
 
         wrapper.simulate("click");
 
-        process.nextTick(() => {
-            // state to be set correctly with response
-            expect(func).toBeCalledTimes(1);
-
-            global.fetch.mockClear();
-            done();
-        });
+        expect(func).toBeCalledTimes(1);
     });
 });