diff --git a/resources/assets/src/components/Modal.vue b/resources/assets/src/components/Modal.vue
index 32ce5db8..0fae01dc 100644
--- a/resources/assets/src/components/Modal.vue
+++ b/resources/assets/src/components/Modal.vue
@@ -1,5 +1,6 @@
 <template>
   <div
+    :id="id"
     class="modal fade"
     tabindex="-1"
     role="dialog"
@@ -72,6 +73,9 @@ export default {
       default: 'confirm',
       validator: value => ['alert', 'confirm', 'prompt'].includes(value),
     },
+    id: {
+      type: String,
+    },
     title: {
       type: String,
       default: trans('general.tip'),
diff --git a/resources/assets/tests/components/Modal.test.ts b/resources/assets/tests/components/Modal.test.ts
index 46100063..7989d3f2 100644
--- a/resources/assets/tests/components/Modal.test.ts
+++ b/resources/assets/tests/components/Modal.test.ts
@@ -2,6 +2,15 @@ import 'bootstrap'
 import { mount } from '@vue/test-utils'
 import Modal from '@/components/Modal.vue'
 
+test('id', () => {
+  const wrapper = mount(Modal, {
+    propsData: {
+      id: 'id',
+    },
+  })
+  expect(wrapper.find('#id').exists()).toBeTrue()
+})
+
 test('title', () => {
   const wrapper = mount(Modal, {
     propsData: {