fix(MdDatepicker): Pick text button (confirm and cancel) from locale configuration (#2078)

* fix(MdDatepicker): Pick text button (confirm and cancel) from locale

* fix(jest): Add jest-localstorage-mock to fix unit test issue

Co-authored-by: Travis <rom.lenzotti@zenika.com>
Co-authored-by: Marcu Beniamin <marqbeniamin@yahoo.com>

Author: 3 people

docs/app/pages/Configuration.vue

@@ -62,7 +62,10 @@
             shorterMonths: ['J', 'F', 'M', 'A', 'M', 'Ju', 'Ju', 'A', 'Se', 'O', 'N', 'D'],
 
             // `0` stand for Sunday, `1` stand for Monday
-            firstDayOfAWeek: 0
+            firstDayOfAWeek: 0,
+
+            cancel: 'Cancel',
+            confirm: 'Ok'
           }
         }
       </code-example>

package.json

@@ -96,6 +96,7 @@
     "is-promise": "^2.1.0",
     "jest": "^22.4.4",
     "jest-vue": "^0.8.2",
+    "jest-localstorage-mock": "^2.4.2",
     "node-sass": "^4.7.2",
     "offline-plugin": "^4.9.1",
     "optimize-css-assets-webpack-plugin": "^3.2.0",

src/components/MdDatepicker/MdDatepickerDialog.vue

@@ -79,8 +79,8 @@
           </div>
 
           <md-dialog-actions class="md-datepicker-body-footer">
-            <md-button class="md-primary" @click="onCancel">Cancel</md-button>
-            <md-button v-if="!mdImmediately" class="md-primary" @click="onConfirm">Ok</md-button>
+            <md-button class="md-primary" @click="onCancel">{{ locale.cancel }}</md-button>
+            <md-button v-if="!mdImmediately" class="md-primary" @click="onConfirm">{{ locale.confirm }}</md-button>
           </md-dialog-actions>
         </div>
       </div>

src/material.js

@@ -16,7 +16,9 @@ const init = () => {
       months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
       shortMonths: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'June', 'July', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec'],
       shorterMonths: ['J', 'F', 'M', 'A', 'M', 'Ju', 'Ju', 'A', 'Se', 'O', 'N', 'D'],
-      firstDayOfAWeek: 0
+      firstDayOfAWeek: 0,
+      cancel: 'Cancel',
+      confirm: 'Ok'
     },
     router: {
       linkActiveClass: 'router-link-active'

test/setup.js

@@ -1,6 +1,7 @@
 import 'regenerator-runtime/runtime'
 import Vue from 'vue'
 import VueMaterial from 'src/material'
+import 'jest-localstorage-mock'
 
 Vue.config.productionTip = false
 Vue.config.devtools = false
@@ -26,4 +27,5 @@ function createAppEl () {
 
 createAppEl()
 
-process.on('unhandledRejection', () => {})
+process.on('unhandledRejection', () => {
+})

yarn.lock

@@ -6108,6 +6108,11 @@ jest-leak-detector@^22.4.0:
   dependencies:
     pretty-format "^22.4.3"
 
+jest-localstorage-mock@^2.4.2:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/jest-localstorage-mock/-/jest-localstorage-mock-2.4.2.tgz#31dd2916713eed3b8703196f60ec85ffd50c1a23"
+  integrity sha512-bywlhvs7RM2vpZ0EN12XOU5C2WAXRUbxl1VOxel4cqRUHD6zaUmh99UzwOTx0fWuqjfd0y/NDvEbewNaJaz+UQ==
+
 jest-matcher-utils@^22.4.0, jest-matcher-utils@^22.4.3:
   version "22.4.3"
   resolved "https://registry.yarnpkg.com/jest-matcher-utils/-/jest-matcher-utils-22.4.3.tgz#4632fe428ebc73ebc194d3c7b65d37b161f710ff"