diff --git a/resources/assets/src/js/i18n.js b/resources/assets/src/js/i18n.js
index b41b1afc..6b5978b3 100644
--- a/resources/assets/src/js/i18n.js
+++ b/resources/assets/src/js/i18n.js
@@ -11,19 +11,16 @@ export function trans(key, parameters = {}) {
     const segments = key.split('.');
     let temp = window.__bs_i18n__ || {};
 
-    for (const i in segments) {
-        if (!temp[segments[i]]) {
+    for (const segment of segments) {
+        if (!temp[segment]) {
             return key;
         } else {
-            temp = temp[segments[i]];
+            temp = temp[segment];
         }
     }
 
-    for (const i in parameters) {
-        if (parameters[i] !== undefined) {
-            temp = temp.replace(':' + i, parameters[i]);
-        }
-    }
+    Object.keys(parameters)
+        .forEach(slot => temp = temp.replace(`:${slot}`, parameters[slot]));
 
     return temp;
 }
@@ -36,6 +33,7 @@ Vue.use(_Vue => {
         } else if (typeof value === 'object') {
             el.textContent = trans(value.path, value.args);
         } else {
+            /* istanbul ignore next */
             if (process.env.NODE_ENV !== 'production') {
                 console.warn('[i18n] Invalid arguments in `v-t` directive.');
             }
diff --git a/resources/assets/tests/js/i18n.test.js b/resources/assets/tests/js/i18n.test.js
new file mode 100644
index 00000000..10f464bb
--- /dev/null
+++ b/resources/assets/tests/js/i18n.test.js
@@ -0,0 +1,58 @@
+import { trans } from '@/js/i18n';
+import Vue from 'vue';
+
+test('mount to global', () => {
+    expect(window.trans).toBe(trans);
+});
+
+test('translate text', () => {
+    window.__bs_i18n__ = { a: { b: { c: 'text', d: 'Hi, :name!' } } };
+    expect(trans('a.b.c')).toBe('text');
+    expect(trans('a.b.d')).toBe('Hi, :name!');
+    expect(trans('a.b.d', { name: 'me' })).toBe('Hi, me!');
+    expect(trans('d.e')).toBe('d.e');
+});
+
+test('Vue directive', () => {
+    const byString = Vue.extend({
+        render(h) {
+            return h('div', {
+                directives: [
+                    {
+                        name: 't',
+                        value: 'abc'
+                    }
+                ]
+            });
+        }
+    });
+    expect((new Vue(byString)).$mount().$el.textContent).toBe('abc');
+
+    const byObject = Vue.extend({
+        render(h) {
+            return h('div', {
+                directives: [
+                    {
+                        name: 't',
+                        value: { path: 'abc', args: '123' }
+                    }
+                ]
+            });
+        }
+    });
+    expect((new Vue(byObject)).$mount().$el.textContent).toBe('abc');
+
+    const invalid = Vue.extend({
+        render(h) {
+            return h('div', {
+                directives: [
+                    {
+                        name: 't',
+                        value: 123
+                    }
+                ]
+            });
+        }
+    });
+    expect((new Vue(invalid)).$mount().$el.textContent).toBe('');
+});