Merge pull request #5659 from formio/FIO-6710-day-component-placehold…

…er-translation

FIO-6710: added translation for day component placeholder

src/components/day/Day.js

@@ -140,7 +140,7 @@ export default class DayComponent extends Field {
         id: `${this.component.key}-${name}`,
         class: `form-control ${this.transform('class', `formio-day-component-${name}`)}`,
         type: this.component.fields[name].type === 'select' ? 'select' : 'number',
-        placeholder: this.component.fields[name].placeholder,
+        placeholder: this.t(this.component.fields[name].placeholder),
         step: 1,
         min,
         max,

src/components/day/Day.unit.js

@@ -11,6 +11,7 @@ import {
   comp4,
   comp5,
   comp6,
+  comp7
 } from './fixtures';
 import PanelComponent from '../panel/Panel';
 
@@ -264,4 +265,22 @@ describe('Day Component', () => {
       }, 500);
     }).catch(done);
   });
+  it('Should translate placeholder text', () => {
+    const element = document.createElement('div');
+    return Formio.createForm(element, comp7, {
+      language: 'sp',
+      i18n: {
+        sp: {
+          Day: "Day1",
+          Month: "Month2",
+          Year: "Year3"
+        }
+      }
+    }).then((form) => {
+      const dayComponent = form.getComponent('day');
+      assert.equal(dayComponent.refs.day.placeholder, 'Day1');
+      assert.equal(dayComponent.refs.month.placeholder, 'Month2');
+      assert.equal(dayComponent.refs.year.placeholder, 'Year3');
+    })
+  });
 });

src/components/day/fixtures/comp7.js

@@ -0,0 +1,107 @@
+export default {
+  components: [
+    {
+      type: 'textfield',
+      key: 'firstName',
+      label: 'First Name',
+      placeholder: 'Enter your first name',
+      input: true
+    }, {
+      "label": "Day",
+      "placeholder": "Day",
+      "applyMaskOn": "change",
+      "tableView": true,
+      "key": "day2",
+      "type": "textfield",
+      "input": true
+    }, {
+      "label": "Month",
+      "placeholder": "Month",
+      "applyMaskOn": "change",
+      "tableView": true,
+      "key": "month2",
+      "type": "textfield",
+      "input": true
+    }, {
+      "label": "Year",
+      "placeholder": "Year",
+      "applyMaskOn": "change",
+      "tableView": true,
+      "key": "year2",
+      "type": "textfield",
+      "input": true
+    },
+    {
+      "label": "Day",
+      "hideInputLabels": false,
+      "inputsLabelPosition": "top",
+      "useLocaleSettings": false,
+      "tableView": false,
+      "fields": {
+        "day": {
+          "placeholder": "Day",
+          "hide": false
+        },
+        "month": {
+          "type": "number",
+          "placeholder": "Month",
+          "hide": false
+        },
+        "year": {
+          "placeholder": "Year",
+          "hide": false
+        }
+      },
+      "key": "day",
+      "type": "day",
+      "input": true,
+      "defaultValue": "00/00/0000"
+    },
+    {
+      type: 'textfield',
+      key: 'lastName',
+      label: 'Last Name',
+      placeholder: 'Enter your last name',
+      input: true
+    },
+    {
+      type: 'survey',
+      key: 'questions',
+      label: 'Survey',
+      values: [
+        {
+          label: 'Great',
+          value: 'great'
+        },
+        {
+          label: 'Good',
+          value: 'good'
+        },
+        {
+          label: 'Poor',
+          value: 'poor'
+        }
+      ],
+      questions: [
+        {
+          label: 'How would you rate the Form.io platform?',
+          value: 'howWouldYouRateTheFormIoPlatform'
+        },
+        {
+          label: 'How was Customer Support?',
+          value: 'howWasCustomerSupport'
+        },
+        {
+          label: 'Overall Experience?',
+          value: 'overallExperience'
+        }
+      ]
+    },
+    {
+      type: 'button',
+      action: 'submit',
+      label: 'Submit',
+      theme: 'primary'
+    }
+  ]
+}

src/components/day/fixtures/index.js

@@ -4,4 +4,5 @@ import comp3 from './comp3';
 import comp4 from './comp4';
 import comp5 from './comp5';
 import comp6 from './comp6';
-export { comp1, comp2, comp3, comp4, comp5, comp6 };
+import comp7 from './comp7';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7 };