12 |
13 |
21 |
22 |
3 |
7 |
8 |
9 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/src/common/api.service.js:
--------------------------------------------------------------------------------
1 | import Vue from "vue";
2 | import axios from "axios";
3 | import VueAxios from "vue-axios";
4 | import JwtService from "@/common/jwt.service";
5 | import { API_URL } from "@/common/config";
6 |
7 | const ApiService = {
8 | init() {
9 | Vue.use(VueAxios, axios);
10 | Vue.axios.defaults.baseURL = API_URL;
11 | },
12 |
13 | setHeader() {
14 | Vue.axios.defaults.headers.common[
15 | "Authorization"
16 | ] = `Token ${JwtService.getToken()}`;
17 | },
18 |
19 | query(resource, params) {
20 | return Vue.axios.get(resource, params).catch(error => {
21 | throw new Error(`[RWV] ApiService ${error}`);
22 | });
23 | },
24 |
25 | get(resource, slug = "") {
26 | return Vue.axios.get(`${resource}/${slug}`).catch(error => {
27 | throw new Error(`[RWV] ApiService ${error}`);
28 | });
29 | },
30 |
31 | post(resource, params) {
32 | return Vue.axios.post(`${resource}`, params);
33 | },
34 |
35 | update(resource, slug, params) {
36 | return Vue.axios.put(`${resource}/${slug}`, params);
37 | },
38 |
39 | put(resource, params) {
40 | return Vue.axios.put(`${resource}`, params);
41 | },
42 |
43 | delete(resource) {
44 | return Vue.axios.delete(resource).catch(error => {
45 | throw new Error(`[RWV] ApiService ${error}`);
46 | });
47 | }
48 | };
49 |
50 | export default ApiService;
51 |
52 | export const TagsService = {
53 | get() {
54 | return ApiService.get("tags");
55 | }
56 | };
57 |
58 | export const ArticlesService = {
59 | query(type, params) {
60 | return ApiService.query("articles" + (type === "feed" ? "/feed" : ""), {
61 | params: params
62 | });
63 | },
64 | get(slug) {
65 | return ApiService.get("articles", slug);
66 | },
67 | create(params) {
68 | return ApiService.post("articles", { article: params });
69 | },
70 | update(slug, params) {
71 | return ApiService.update("articles", slug, { article: params });
72 | },
73 | destroy(slug) {
74 | return ApiService.delete(`articles/${slug}`);
75 | }
76 | };
77 |
78 | export const CommentsService = {
79 | get(slug) {
80 | if (typeof slug !== "string") {
81 | throw new Error(
82 | "[RWV] CommentsService.get() article slug required to fetch comments"
83 | );
84 | }
85 | return ApiService.get("articles", `${slug}/comments`);
86 | },
87 |
88 | post(slug, payload) {
89 | return ApiService.post(`articles/${slug}/comments`, {
90 | comment: { body: payload }
91 | });
92 | },
93 |
94 | destroy(slug, commentId) {
95 | return ApiService.delete(`articles/${slug}/comments/${commentId}`);
96 | }
97 | };
98 |
99 | export const FavoriteService = {
100 | add(slug) {
101 | return ApiService.post(`articles/${slug}/favorite`);
102 | },
103 | remove(slug) {
104 | return ApiService.delete(`articles/${slug}/favorite`);
105 | }
106 | };
107 |
--------------------------------------------------------------------------------
/src/common/config.js:
--------------------------------------------------------------------------------
1 | export const API_URL = "https://conduit.productionready.io/api";
2 | export default API_URL;
3 |
--------------------------------------------------------------------------------
/src/common/date.filter.js:
--------------------------------------------------------------------------------
1 | import { default as format } from "date-fns/format";
2 |
3 | export default date => {
4 | return format(new Date(date), "MMMM D, YYYY");
5 | };
6 |
--------------------------------------------------------------------------------
/src/common/error.filter.js:
--------------------------------------------------------------------------------
1 | export default errorValue => {
2 | return `${errorValue[0]}`;
3 | };
4 |
--------------------------------------------------------------------------------
/src/common/jwt.service.js:
--------------------------------------------------------------------------------
1 | const ID_TOKEN_KEY = "id_token";
2 |
3 | export const getToken = () => {
4 | return window.localStorage.getItem(ID_TOKEN_KEY);
5 | };
6 |
7 | export const saveToken = token => {
8 | window.localStorage.setItem(ID_TOKEN_KEY, token);
9 | };
10 |
11 | export const destroyToken = () => {
12 | window.localStorage.removeItem(ID_TOKEN_KEY);
13 | };
14 |
15 | export default { getToken, saveToken, destroyToken };
16 |
--------------------------------------------------------------------------------
/src/components/ArticleActions.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
3 |
16 |
17 |
18 |
126 |
--------------------------------------------------------------------------------
/src/components/ArticleMeta.vue:
--------------------------------------------------------------------------------
1 |
2 | Loading articles...
4 |
5 |
15 |
6 | No articles are here... yet.
7 |
8 |
3 |
6 | ![]()
7 |
8 |
35 |
36 |
37 |
79 |
--------------------------------------------------------------------------------
/src/components/Comment.vue:
--------------------------------------------------------------------------------
1 |
2 |
9 |
13 | {{ article.author.username }}
14 |
15 | {{ article.createdAt | date }}
16 |
17 |
3 |
22 |
23 |
24 |
50 |
--------------------------------------------------------------------------------
/src/components/CommentEditor.vue:
--------------------------------------------------------------------------------
1 |
2 |
4 |
6 | {{ comment.body }}
5 |
7 |
8 | ![]()
9 |
10 |
14 | {{ comment.author.username }}
15 |
16 | {{ comment.createdAt | date }}
17 |
20 |
21 |
3 |
20 |
21 |
22 |
55 |
--------------------------------------------------------------------------------
/src/components/ListErrors.vue:
--------------------------------------------------------------------------------
1 |
2 |
8 |
9 |
10 |
18 |
--------------------------------------------------------------------------------
/src/components/TagList.vue:
--------------------------------------------------------------------------------
1 |
2 |
11 |
12 |
13 |
21 |
--------------------------------------------------------------------------------
/src/components/TheFooter.vue:
--------------------------------------------------------------------------------
1 |
2 |
15 |
16 |
17 |
22 |
--------------------------------------------------------------------------------
/src/components/TheHeader.vue:
--------------------------------------------------------------------------------
1 |
2 |
85 |
86 |
87 |
97 |
--------------------------------------------------------------------------------
/src/components/VArticlePreview.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
5 |
6 |
7 | Read more...
8 |
10 |
11 |
12 |
13 |
38 |
--------------------------------------------------------------------------------
/src/components/VPagination.vue:
--------------------------------------------------------------------------------
1 |
2 |
15 |
16 |
17 |
44 |
--------------------------------------------------------------------------------
/src/components/VTag.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
9 |
52 |
53 |
54 |
96 |
--------------------------------------------------------------------------------
/src/views/ArticleEdit.vue:
--------------------------------------------------------------------------------
1 |
2 |
10 |
24 |
51 |
11 |
23 | 24 |
25 |
27 |
28 |
50 |
29 |
34 |
35 |
47 |
48 |
49 |
36 |
3 |
66 |
67 |
68 |
151 |
--------------------------------------------------------------------------------
/src/views/Home.vue:
--------------------------------------------------------------------------------
1 |
2 |
4 |
65 |
5 |
64 |
6 |
63 |
3 |
9 |
58 |
59 |
60 |
81 |
--------------------------------------------------------------------------------
/src/views/HomeGlobal.vue:
--------------------------------------------------------------------------------
1 |
2 |
10 |
57 |
11 |
56 |
12 |
46 |
13 |
43 |
44 |
47 |
54 |
55 |
3 |
40 |
41 |
42 |
68 |
--------------------------------------------------------------------------------
/src/views/Profile.vue:
--------------------------------------------------------------------------------
1 |
2 |
4 |
39 |
5 |
38 |
6 |
37 | Sign in
7 |
8 |
3 |
73 |
74 |
75 |
113 |
--------------------------------------------------------------------------------
/src/views/ProfileArticles.vue:
--------------------------------------------------------------------------------
1 |
2 |
4 |
40 |
41 |
5 |
39 |
6 |
38 |
7 | ![]()
8 |
37 | {{ profile.username }}
9 |{{ profile.bio }}
10 |
11 |
15 | Edit Profile Settings
16 |
17 |
18 |
19 |
27 |
35 |
36 |
42 |
72 |
43 |
71 |
44 |
70 |
45 |
67 |
68 |
3 |
5 |
6 |
7 |
22 |
--------------------------------------------------------------------------------
/src/views/ProfileFavorited.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
23 |
--------------------------------------------------------------------------------
/src/views/Register.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
48 |
49 |
50 |
81 |
--------------------------------------------------------------------------------
/src/views/Settings.vue:
--------------------------------------------------------------------------------
1 |
2 |
4 |
47 |
5 |
46 |
6 |
45 | Sign up
7 |
8 |
3 |
63 |
64 |
65 |
89 |
--------------------------------------------------------------------------------
/static/rwv-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gothinkster/vue-realworld-example-app/3df3773b6be7181aadb513572458fba049fe66f9/static/rwv-logo.png
--------------------------------------------------------------------------------
/tests/unit/.eslintrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | env: {
3 | jest: true
4 | }
5 | };
6 |
--------------------------------------------------------------------------------
/tests/unit/components/ListError.spec.js:
--------------------------------------------------------------------------------
1 | import { mount } from "@vue/test-utils";
2 |
3 | import ListErrors from "../../../src/components/ListErrors.vue";
4 |
5 | const createWrapper = ({ errors }) => {
6 | return mount(ListErrors, {
7 | propsData: {
8 | errors
9 | }
10 | });
11 | };
12 |
13 | describe("ListErrors", () => {
14 | let errors;
15 |
16 | beforeEach(() => {
17 | errors = {
18 | title: ["Title Error"],
19 | body: ["can't be blank"],
20 | description: ["can't be blank"]
21 | };
22 | });
23 |
24 | it("should display the correct error messages based on object from props", () => {
25 | const wrapper = createWrapper({ errors });
26 |
27 | const errorMessages = wrapper.findAll("li");
28 | expect(errorMessages.length).toEqual(3);
29 | expect(errorMessages.at(0).text()).toContain(errors.title);
30 | expect(errorMessages.at(1).text()).toContain(errors.body);
31 | expect(errorMessages.at(2).text()).toContain(errors.description);
32 | });
33 |
34 | it("should have props with errors as type object", () => {
35 | const wrapper = createWrapper({ errors });
36 | expect(typeof wrapper.props().errors).toBe("object");
37 | });
38 |
39 | it("should have no errors if no errors are passed into the props", () => {
40 | errors = {};
41 |
42 | const wrapper = createWrapper({ errors });
43 |
44 | const errorMessages = wrapper.findAll("li");
45 | expect(errorMessages.length).toEqual(0);
46 | });
47 | });
48 |
--------------------------------------------------------------------------------
/tests/unit/components/VPagination.spec.js:
--------------------------------------------------------------------------------
1 | import { mount } from "@vue/test-utils";
2 |
3 | import VPagination from "../../../src/components/VPagination.vue";
4 |
5 | const createWrapper = ({ currentPage = 1 }) => {
6 | return mount(VPagination, {
7 | propsData: {
8 | pages: [1, 2, 3, 4],
9 | currentPage
10 | }
11 | });
12 | };
13 |
14 | describe("VPagination", () => {
15 | it("should render active class to right element", () => {
16 | const wrapper = createWrapper({ currentPage: 2 });
17 | const activeItem = wrapper.find(".active");
18 | expect(activeItem.text()).toBe("2");
19 | });
20 |
21 | it("should emit an event if page is clicked which is not active", () => {
22 | const wrapper = createWrapper({ currentPage: 1 });
23 | const pageItem = wrapper.find('[data-test="page-link-2"]');
24 | pageItem.trigger("click");
25 | expect(wrapper.emitted("update:currentPage")).toBeTruthy();
26 | });
27 |
28 | it("should have the right payload when event is emitted", () => {
29 | const wrapper = createWrapper({ currentPage: 1 });
30 | const pageItem = wrapper.find('[data-test="page-link-2"]');
31 | pageItem.trigger("click");
32 | expect(wrapper.emitted("update:currentPage")[0][0]).toBe(2);
33 | });
34 | });
35 |
--------------------------------------------------------------------------------
/tests/unit/components/VTag.spec.js:
--------------------------------------------------------------------------------
1 | import { mount, createLocalVue } from "@vue/test-utils";
2 |
3 | import router from "../../../src/router/index";
4 | import VTag from "../../../src/components/VTag";
5 |
6 | const localVue = createLocalVue();
7 | const createWrapper = () => {
8 | return mount(VTag, {
9 | localVue,
10 | router,
11 | propsData: {
12 | name: "Foo"
13 | }
14 | });
15 | };
16 |
17 | describe("VTag", () => {
18 | it("should update the route on click", async () => {
19 | const wrapper = createWrapper();
20 | const routerBefore = wrapper.vm.$route.path;
21 | wrapper.find("a").trigger("click");
22 | await localVue.nextTick();
23 | expect(wrapper.vm.$route.path).not.toBe(routerBefore);
24 | });
25 | });
26 |
--------------------------------------------------------------------------------
/tests/unit/example.spec.js:
--------------------------------------------------------------------------------
1 | import { createLocalVue, mount } from "@vue/test-utils";
2 | import Vuex from "vuex";
3 | import VueRouter from "vue-router";
4 |
5 | import Comment from "../../src/components/Comment.vue";
6 | import DateFilter from "../../src/common/date.filter";
7 |
8 | const localVue = createLocalVue();
9 | localVue.filter("date", DateFilter);
10 | localVue.use(Vuex);
11 | localVue.use(VueRouter);
12 |
13 | describe("Comment", () => {
14 | it("should render correct contents", () => {
15 | const router = new VueRouter({
16 | routes: [
17 | {
18 | name: "profile",
19 | path: "/profile",
20 | component: null
21 | }
22 | ]
23 | });
24 | let store = new Vuex.Store({
25 | getters: {
26 | currentUser: () => ({
27 | username: "user-3518518"
28 | })
29 | }
30 | });
31 |
32 | const wrapper = mount(Comment, {
33 | localVue,
34 | store,
35 | router,
36 | propsData: {
37 | slug: "super-cool-comment-slug-1245781274",
38 | comment: {
39 | body: "body of comment",
40 | author: {
41 | image: "https://vuejs.org/images/logo.png",
42 | username: "user-3518518"
43 | },
44 | createdAt: "",
45 | id: 1245781274
46 | }
47 | }
48 | });
49 | expect(wrapper.isVueInstance()).toBeTruthy();
50 | });
51 | });
52 |
--------------------------------------------------------------------------------
/tests/unit/store/__snapshots__/article.module.spec.js.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Vuex Article Module should return the data of the api call when calling the function 1`] = `
4 | Object {
5 | "article": Object {
6 | "author": Object {},
7 | "body": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
8 | "description": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
9 | "tagList": Array [
10 | "lorem",
11 | "ipsum",
12 | "javascript",
13 | "vue",
14 | ],
15 | "title": "Lorem ipsum dolor sit amet",
16 | },
17 | }
18 | `;
19 |
--------------------------------------------------------------------------------
/tests/unit/store/article.module.spec.js:
--------------------------------------------------------------------------------
1 | import { actions } from "../../../src/store/article.module";
2 | import {
3 | FETCH_ARTICLE,
4 | FETCH_COMMENTS,
5 | COMMENT_CREATE,
6 | COMMENT_DESTROY,
7 | FAVORITE_ADD,
8 | FAVORITE_REMOVE
9 | } from "../../../src/store/actions.type";
10 |
11 | jest.mock("vue", () => {
12 | return {
13 | axios: {
14 | get: jest.fn().mockImplementation(async articleSlug => {
15 | if (articleSlug.includes("8371b051-cffc-4ff0-887c-2c477615a28e")) {
16 | return {
17 | data: {
18 | article: {
19 | author: {},
20 | title: "Lorem ipsum dolor sit amet",
21 | description:
22 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
23 | body:
24 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
25 | tagList: ["lorem", "ipsum", "javascript", "vue"]
26 | }
27 | }
28 | };
29 | }
30 | if (articleSlug.includes("f986b3d6-95c2-4c4f-a6b9-fbbf79d8cb0c")) {
31 | return {
32 | data: {
33 | comments: [
34 | {
35 | id: 1,
36 | createdAt: "2018-12-01T15:43:41.235Z",
37 | updatedAt: "2018-12-01T15:43:41.235Z",
38 | body: "Lorem ipsum dolor sit amet.",
39 | author: {
40 | username: "dccf649a-5e7b-4040-b8c3-ecf74598eba2",
41 | bio: null,
42 | image: "https://via.placeholder.com/350x150",
43 | following: false
44 | }
45 | },
46 | {
47 | id: 2,
48 | createdAt: "2018-12-01T15:43:39.077Z",
49 | updatedAt: "2018-12-01T15:43:39.077Z",
50 | body:
51 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse aliquet.",
52 | author: {
53 | username: "8568a50a-9656-4d55-a023-632029513a2d",
54 | bio: null,
55 | image: "https://via.placeholder.com/350x150",
56 | following: false
57 | }
58 | }
59 | ]
60 | }
61 | };
62 | }
63 | throw new Error("Article not existing");
64 | }),
65 | post: jest.fn().mockImplementation(async articleSlug => {
66 | if (articleSlug.includes("582e1e46-6b8b-4f4d-8848-f07b57e015a0")) {
67 | return null;
68 | }
69 | if (articleSlug.includes("5611ee1b-0b95-417f-a917-86687176a627")) {
70 | return {
71 | data: {
72 | article: {
73 | author: {},
74 | title: "Lorem ipsum dolor sit amet",
75 | description:
76 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
77 | body:
78 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
79 | tagList: ["lorem", "ipsum", "javascript", "vue"]
80 | }
81 | }
82 | };
83 | }
84 | throw new Error("Article not existing");
85 | }),
86 | delete: jest.fn().mockImplementation(async articleSlug => {
87 | if (articleSlug.includes("657a6075-d269-4aec-83fa-b14f579a3e78")) {
88 | return null;
89 | }
90 | if (articleSlug.includes("480fdaf8-027c-43b1-8952-8403f90dcdab")) {
91 | return {
92 | data: {
93 | article: {
94 | author: {},
95 | title: "Lorem ipsum dolor sit amet",
96 | description:
97 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
98 | body:
99 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
100 | tagList: ["lorem", "ipsum", "javascript", "vue"]
101 | }
102 | }
103 | };
104 | }
105 | throw new Error("Article not existing");
106 | })
107 | }
108 | };
109 | });
110 |
111 | describe("Vuex Article Module", () => {
112 | it("should commit the previous article if it is given", async () => {
113 | const commitFunction = jest.fn();
114 | const context = { commit: commitFunction };
115 | const articleSlug = "8371b051-cffc-4ff0-887c-2c477615a28e";
116 | const prevArticle = {
117 | author: {},
118 | title: "Aye up, she's a reight bobby dazzler",
119 | description:
120 | "Yer flummoxed. Fair t' middlin, this is. Off f'r a sup down t'pub, to'neet. Ee bye ecky thump!",
121 | body:
122 | "Tha's better bi careful, lass - yer on a Scarborough warning! Tha meks a better door than a winder. Do I 'eckers like, You're in luck m'boy! Am proper knackered, aye I am that is I say.",
123 | tagList: ["aye", "ipsum", "javascript", "vue"]
124 | };
125 | await actions[FETCH_ARTICLE](context, articleSlug, prevArticle);
126 | expect(commitFunction.mock.calls[0][0]).toBe("setArticle");
127 | expect(commitFunction.mock.calls[0][1]).toBe(prevArticle);
128 | });
129 |
130 | it("should return the data of the api call when calling the function", async () => {
131 | const context = { commit: () => {} };
132 | const articleSlug = "8371b051-cffc-4ff0-887c-2c477615a28e";
133 | const prevArticle = undefined;
134 | const actionCall = await actions[FETCH_ARTICLE](
135 | context,
136 | articleSlug,
137 | prevArticle
138 | );
139 | expect(actionCall).toMatchSnapshot();
140 | });
141 |
142 | it("should commit the right name when fetching comments for an existing article", async () => {
143 | const commitFunction = jest.fn();
144 | const context = { commit: commitFunction };
145 | const articleSlug = "f986b3d6-95c2-4c4f-a6b9-fbbf79d8cb0c";
146 | await actions[FETCH_COMMENTS](context, articleSlug);
147 | expect(commitFunction.mock.calls[0][0]).toBe("setComments");
148 | });
149 |
150 | it("should commit the exact size of comments", async () => {
151 | const commitFunction = jest.fn();
152 | const context = { commit: commitFunction };
153 | const articleSlug = "f986b3d6-95c2-4c4f-a6b9-fbbf79d8cb0c";
154 | await actions[FETCH_COMMENTS](context, articleSlug);
155 | expect(commitFunction.mock.calls[0][1]).toHaveLength(2);
156 | });
157 |
158 | it("should return the comments from the fetch comments action", async () => {
159 | const context = { commit: () => {} };
160 | const articleSlug = "f986b3d6-95c2-4c4f-a6b9-fbbf79d8cb0c";
161 | const comments = await actions[FETCH_COMMENTS](context, articleSlug);
162 | expect(comments).toHaveLength(2);
163 | });
164 |
165 | it("should dispatch a fetching comment action after successfully creating a comment", async () => {
166 | const dispatchFunction = jest.fn();
167 | const context = { dispatch: dispatchFunction };
168 | const payload = {
169 | slug: "582e1e46-6b8b-4f4d-8848-f07b57e015a0",
170 | comment: "Lorem Ipsum"
171 | };
172 | await actions[COMMENT_CREATE](context, payload);
173 | expect(dispatchFunction).toHaveBeenLastCalledWith(
174 | "fetchComments",
175 | "582e1e46-6b8b-4f4d-8848-f07b57e015a0"
176 | );
177 | });
178 |
179 | it("should dispatch a fetching comment action after successfully deleting a comment", async () => {
180 | const dispatchFunction = jest.fn();
181 | const context = { dispatch: dispatchFunction };
182 | const payload = {
183 | slug: "657a6075-d269-4aec-83fa-b14f579a3e78",
184 | commentId: 1
185 | };
186 | await actions[COMMENT_DESTROY](context, payload);
187 | expect(dispatchFunction).toHaveBeenLastCalledWith(
188 | "fetchComments",
189 | "657a6075-d269-4aec-83fa-b14f579a3e78"
190 | );
191 | });
192 |
193 | it("should commit updating the article in the list action favorize an article", async () => {
194 | const commitFunction = jest.fn();
195 | const context = { commit: commitFunction };
196 | const payload = "5611ee1b-0b95-417f-a917-86687176a627";
197 | await actions[FAVORITE_ADD](context, payload);
198 | expect(commitFunction.mock.calls[0][0]).toBe("updateArticleInList");
199 | expect(commitFunction.mock.calls[0][1]).toEqual({
200 | author: {},
201 | title: "Lorem ipsum dolor sit amet",
202 | description:
203 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
204 | body:
205 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
206 | tagList: ["lorem", "ipsum", "javascript", "vue"]
207 | });
208 | });
209 |
210 | it("should commit setting the article", async () => {
211 | const commitFunction = jest.fn();
212 | const context = { commit: commitFunction };
213 | const payload = "5611ee1b-0b95-417f-a917-86687176a627";
214 | await actions[FAVORITE_ADD](context, payload);
215 | expect(commitFunction.mock.calls[1][0]).toBe("setArticle");
216 | expect(commitFunction.mock.calls[1][1]).toEqual({
217 | author: {},
218 | title: "Lorem ipsum dolor sit amet",
219 | description:
220 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
221 | body:
222 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
223 | tagList: ["lorem", "ipsum", "javascript", "vue"]
224 | });
225 | });
226 |
227 | it("should commit updating the article in the list action favorize an article", async () => {
228 | const commitFunction = jest.fn();
229 | const context = { commit: commitFunction };
230 | const payload = "480fdaf8-027c-43b1-8952-8403f90dcdab";
231 | await actions[FAVORITE_REMOVE](context, payload);
232 | expect(commitFunction.mock.calls[0][0]).toBe("updateArticleInList");
233 | expect(commitFunction.mock.calls[0][1]).toEqual({
234 | author: {},
235 | title: "Lorem ipsum dolor sit amet",
236 | description:
237 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
238 | body:
239 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
240 | tagList: ["lorem", "ipsum", "javascript", "vue"]
241 | });
242 | });
243 |
244 | it("should commit setting the article", async () => {
245 | const commitFunction = jest.fn();
246 | const context = { commit: commitFunction };
247 | const payload = "480fdaf8-027c-43b1-8952-8403f90dcdab";
248 | await actions[FAVORITE_REMOVE](context, payload);
249 | expect(commitFunction.mock.calls[1][0]).toBe("setArticle");
250 | expect(commitFunction.mock.calls[1][1]).toEqual({
251 | author: {},
252 | title: "Lorem ipsum dolor sit amet",
253 | description:
254 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed cursus nisl. Morbi pulvinar nisl urna, tincidunt mattis tortor sollicitudin eget. Nulla viverra justo quis.",
255 | body:
256 | "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dictum efficitur justo, nec aliquam quam rutrum in. Pellentesque vulputate augue quis vulputate finibus. Phasellus auctor semper sapien sit amet interdum. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas placerat auctor metus. Integer blandit lacinia volutpat.",
257 | tagList: ["lorem", "ipsum", "javascript", "vue"]
258 | });
259 | });
260 | });
261 |
--------------------------------------------------------------------------------
4 |
62 |
5 |
61 |
6 |
56 | 59 |
60 | Your Settings
7 | 54 | 55 |56 | 59 |