-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #184 from mrc-ide/mrc-3700
mrc-3700 Delete session from front end storage
- Loading branch information
Showing
11 changed files
with
262 additions
and
37 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,50 @@ | ||
| <template> | ||
| <div> | ||
| <div v-if="open" class="modal-backdrop fade show"></div> | ||
| <div class="modal" :class="{show: open}" :style="modalStyle"> | ||
| <div class="modal-dialog modal-dialog-centered"> | ||
| <div class="modal-content"> | ||
| <div class="modal-header"> | ||
| <h5 class="modal-title">{{ title }}</h5> | ||
| </div> | ||
| <div class="modal-body"> | ||
| {{ props.text }} | ||
| </div> | ||
| <div class="modal-footer"> | ||
| <button class="btn btn-primary" | ||
| id="confirm-yes" | ||
| @click="confirm">Yes</button> | ||
| <button class="btn btn-outline" | ||
| id="confirm-no" | ||
| @click="close">No</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <script setup lang="ts"> | ||
| import { computed, defineProps, defineEmits } from "vue"; | ||
| const props = defineProps({ | ||
| open: Boolean, | ||
| title: String, | ||
| text: String | ||
| }); | ||
| const emit = defineEmits(["close", "confirm"]); | ||
| const modalStyle = computed(() => { | ||
| return { display: props.open ? "block" : "none" }; | ||
| }); | ||
| const close = () => { | ||
| emit("close"); | ||
| }; | ||
| const confirm = () => { | ||
| emit("confirm"); | ||
| close(); | ||
| }; | ||
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| import { mount } from "@vue/test-utils"; | ||
| import ConfirmModal from "../../../src/app/components/ConfirmModal.vue"; | ||
|
|
||
| describe("ConfirmModal", () => { | ||
| const getWrapper = (open = true, title = "Delete something", text = "Really?") => { | ||
| return mount(ConfirmModal, { props: { title, text, open } }); | ||
| }; | ||
|
|
||
| it("renders as expected", () => { | ||
| const wrapper = getWrapper(); | ||
| expect(wrapper.find(".modal-title").text()).toBe("Delete something"); | ||
| expect(wrapper.find(".modal-body").text()).toBe("Really?"); | ||
| expect(wrapper.find("button#confirm-yes").text()).toBe("Yes"); | ||
| expect(wrapper.find("button#confirm-no").text()).toBe("No"); | ||
| expect((wrapper.find("div.modal").element as HTMLDivElement).style.display).toBe("block"); | ||
| }); | ||
|
|
||
| it("hides modal when not open", () => { | ||
| const wrapper = getWrapper(false); | ||
| expect((wrapper.find("div.modal").element as HTMLDivElement).style.display).toBe("none"); | ||
| }); | ||
|
|
||
| it("No button emits close", async () => { | ||
| const wrapper = getWrapper(); | ||
| await wrapper.find("button#confirm-no").trigger("click"); | ||
| expect(wrapper.emitted("close")!.length).toBe(1); | ||
| expect(wrapper.emitted("confirm")).toBe(undefined); | ||
| }); | ||
|
|
||
| it("Yes button emits close and confirm", async () => { | ||
| const wrapper = getWrapper(); | ||
| await wrapper.find("button#confirm-yes").trigger("click"); | ||
| expect(wrapper.emitted("close")!.length).toBe(1); | ||
| expect(wrapper.emitted("confirm")!.length).toBe(1); | ||
| }); | ||
| }); |
Oops, something went wrong.