PageRenderTime 46ms CodeModel.GetById 15ms RepoModel.GetById 0ms app.codeStats 0ms

/test/spec/i18n.js

https://gitlab.com/x33n/formvalidation
JavaScript | 322 lines | 294 code | 28 blank | 0 comment | 0 complexity | 492bc2844ddde4e62b656eea7ea5a7bb MD5 | raw file
  1. describe('i18n', function() {
  2. beforeEach(function() {
  3. $([
  4. '<form id="i18nForm" class="form-horizontal">',
  5. '<div class="form-group">',
  6. '<label class="col-lg-3 control-label">Full name</label>',
  7. '<div class="col-lg-5">',
  8. '<input type="text" class="form-control" name="fullName" />',
  9. '</div>',
  10. '</div>',
  11. '<div class="form-group">',
  12. '<label class="col-lg-3 control-label">Username</label>',
  13. '<div class="col-lg-5">',
  14. '<input type="text" class="form-control" name="username" />',
  15. '</div>',
  16. '</div>',
  17. '<div class="form-group">',
  18. '<label class="col-lg-3 control-label">Email address</label>',
  19. '<div class="col-lg-5">',
  20. '<input type="text" class="form-control" name="email" />',
  21. '</div>',
  22. '</div>',
  23. '<div class="form-group">',
  24. '<label class="col-lg-3 control-label">Password</label>',
  25. '<div class="col-lg-5">',
  26. '<input type="password" class="form-control" name="password" />',
  27. '</div>',
  28. '</div>',
  29. '<div class="form-group">',
  30. '<label class="col-lg-3 control-label">Retype password</label>',
  31. '<div class="col-lg-5">',
  32. '<input type="password" class="form-control" name="confirmPassword" />',
  33. '</div>',
  34. '</div>',
  35. '<div class="form-group">',
  36. '<label class="col-lg-3 control-label">Gender</label>',
  37. '<div class="col-lg-5">',
  38. '<div class="radio">',
  39. '<label><input type="radio" name="gender" value="male" /> Male</label>',
  40. '</div>',
  41. '<div class="radio">',
  42. '<label><input type="radio" name="gender" value="female" /> Female</label>',
  43. '</div>',
  44. '<div class="radio">',
  45. '<label><input type="radio" name="gender" value="other" /> Other</label>',
  46. '</div>',
  47. '</div>',
  48. '</div>',
  49. '<div class="form-group">',
  50. '<label class="col-lg-3 control-label">Age</label>',
  51. '<div class="col-lg-3">',
  52. '<input type="text" class="form-control" name="age" />',
  53. '</div>',
  54. '</div>',
  55. '<div class="form-group">',
  56. '<label class="col-lg-3 control-label">Website</label>',
  57. '<div class="col-lg-5">',
  58. '<input type="text" class="form-control" name="website" />',
  59. '</div>',
  60. '</div>',
  61. '<div class="form-group">',
  62. '<label class="col-lg-3 control-label">Phone number</label>',
  63. '<div class="col-lg-5">',
  64. '<input type="text" class="form-control" name="phoneNumber" />',
  65. '</div>',
  66. '</div>',
  67. '<div class="form-group">',
  68. '<label class="col-lg-3 control-label">Languages</label>',
  69. '<div class="col-lg-5">',
  70. '<div class="checkbox">',
  71. '<label><input type="checkbox" name="languages[]" value="english" /> English</label>',
  72. '</div>',
  73. '<div class="checkbox">',
  74. '<label><input type="checkbox" name="languages[]" value="french" /> French</label>',
  75. '</div>',
  76. '<div class="checkbox">',
  77. '<label><input type="checkbox" name="languages[]" value="german" /> German</label>',
  78. '</div>',
  79. '<div class="checkbox">',
  80. '<label><input type="checkbox" name="languages[]" value="russian" /> Russian</label>',
  81. '</div>',
  82. '<div class="checkbox">',
  83. '<label><input type="checkbox" name="languages[]" value="other" /> Other</label>',
  84. '</div>',
  85. '</div>',
  86. '</div>',
  87. '<div class="form-group">',
  88. '<label class="col-lg-3 control-label">Programming Languages</label>',
  89. '<div class="col-lg-5">',
  90. '<div class="checkbox">',
  91. '<label><input type="checkbox" name="programs[]" value="net" /> .Net</label>',
  92. '</div>',
  93. '<div class="checkbox">',
  94. '<label><input type="checkbox" name="programs[]" value="java" /> Java</label>',
  95. '</div>',
  96. '<div class="checkbox">',
  97. '<label><input type="checkbox" name="programs[]" value="c" /> C/C++</label>',
  98. '</div>',
  99. '<div class="checkbox">',
  100. '<label><input type="checkbox" name="programs[]" value="php" /> PHP</label>',
  101. '</div>',
  102. '<div class="checkbox">',
  103. '<label><input type="checkbox" name="programs[]" value="perl" /> Perl</label>',
  104. '</div>',
  105. '<div class="checkbox">',
  106. '<label><input type="checkbox" name="programs[]" value="ruby" /> Ruby</label>',
  107. '</div>',
  108. '<div class="checkbox">',
  109. '<label><input type="checkbox" name="programs[]" value="python" /> Python</label>',
  110. '</div>',
  111. '<div class="checkbox">',
  112. '<label><input type="checkbox" name="programs[]" value="javascript" /> Javascript</label>',
  113. '</div>',
  114. '</div>',
  115. '</div>',
  116. '</form>'
  117. ].join('')).appendTo('body');
  118. $('#i18nForm').formValidation({
  119. clazz: {
  120. icon: {
  121. valid: 'glyphicon glyphicon-ok',
  122. invalid: 'glyphicon glyphicon-remove',
  123. validating: 'glyphicon glyphicon-refresh'
  124. }
  125. },
  126. fields: {
  127. fullName: {
  128. validators: {
  129. notEmpty: {},
  130. stringCase: {
  131. 'case': 'upper'
  132. }
  133. }
  134. },
  135. username: {
  136. validators: {
  137. notEmpty: {},
  138. stringLength: {
  139. min: 6,
  140. max: 20
  141. },
  142. regexp: {
  143. regexp: /^[a-zA-Z0-9_\.]+$/
  144. },
  145. different: {
  146. field: 'password'
  147. }
  148. }
  149. },
  150. email: {
  151. validators: {
  152. emailAddress: {}
  153. }
  154. },
  155. password: {
  156. validators: {
  157. notEmpty: {},
  158. different: {
  159. field: 'username'
  160. }
  161. }
  162. },
  163. confirmPassword: {
  164. validators: {
  165. notEmpty: {},
  166. identical: {
  167. field: 'password'
  168. },
  169. different: {
  170. field: 'username'
  171. }
  172. }
  173. },
  174. age: {
  175. validators: {
  176. notEmpty: {},
  177. digits: {},
  178. greaterThan: {
  179. value: 18
  180. },
  181. lessThan: {
  182. value: 100
  183. }
  184. }
  185. },
  186. website: {
  187. validators: {
  188. notEmpty: {},
  189. uri: {}
  190. }
  191. },
  192. phoneNumber: {
  193. validators: {
  194. notEmpty: {},
  195. digits: {},
  196. phone: {
  197. country: 'US'
  198. }
  199. }
  200. },
  201. gender: {
  202. validators: {
  203. notEmpty: {}
  204. }
  205. },
  206. 'languages[]': {
  207. validators: {
  208. notEmpty: {}
  209. }
  210. },
  211. 'programs[]': {
  212. validators: {
  213. choice: {
  214. min: 2,
  215. max: 4
  216. }
  217. }
  218. }
  219. }
  220. });
  221. this.fv = $('#i18nForm').data('formValidation');
  222. this.$fullName = this.fv.getFieldElements('fullName');
  223. this.$email = this.fv.getFieldElements('email');
  224. this.$userName = this.fv.getFieldElements('username');
  225. this.$password = this.fv.getFieldElements('password');
  226. this.$confirm = this.fv.getFieldElements('confirmPassword');
  227. this.$age = this.fv.getFieldElements('age');
  228. this.$website = this.fv.getFieldElements('website');
  229. this.$phone = this.fv.getFieldElements('phoneNumber');
  230. this.$program = this.fv.getFieldElements('programs[]');
  231. });
  232. afterEach(function() {
  233. $('#i18nForm').formValidation('destroy').remove();
  234. });
  235. it('default message', function() {
  236. var format = FormValidation.Helper.format,
  237. i18n = FormValidation.I18n[this.fv.getLocale()];
  238. this.fv.validate();
  239. expect(this.fv.getMessages(this.$fullName, 'notEmpty')[0]).toEqual(i18n.notEmpty['default']);
  240. this.$fullName.val('lowerName');
  241. this.fv.revalidateField('fullName');
  242. expect(this.fv.getMessages('fullName', 'stringCase')[0]).toEqual(i18n.stringCase.upper);
  243. this.fv.resetForm();
  244. this.$userName.val('123');
  245. this.fv.validate();
  246. expect(this.fv.getMessages('username', 'stringLength')[0]).toEqual(format(i18n.stringLength.between, [6, 20]));
  247. this.fv.resetForm();
  248. this.$userName.val('contain@#$');
  249. this.fv.validate();
  250. expect(this.fv.getMessages(this.$userName, 'regexp')[0]).toEqual(i18n.regexp['default']);
  251. this.fv.resetForm();
  252. this.$userName.val('validUserName');
  253. this.$password.val('validUserName');
  254. this.fv.validate();
  255. expect(this.fv.getMessages('username', 'different')[0]).toEqual(i18n.different['default']);
  256. this.fv.resetForm();
  257. this.$email.val('A@b@c@example.com');
  258. this.fv.validate();
  259. expect(this.fv.getMessages(this.$email, 'emailAddress')[0]).toEqual(i18n.emailAddress['default']);
  260. this.fv.resetForm();
  261. this.$password.val('@S3cur3P@@w0rd');
  262. this.$confirm.val('notMatch');
  263. this.fv.validate();
  264. expect(this.fv.getMessages('confirmPassword', 'identical')[0]).toEqual(i18n.identical['default']);
  265. this.fv.resetForm();
  266. this.$age.val('notDigit');
  267. this.fv.validate();
  268. expect(this.fv.getMessages('age', 'digits')[0]).toEqual(i18n.digits['default']);
  269. this.fv.resetForm();
  270. this.$age.val(10);
  271. this.fv.validate();
  272. expect(this.fv.getMessages(this.$age, 'greaterThan')[0]).toEqual(format(i18n.greaterThan['default'], 18));
  273. this.fv.resetForm();
  274. this.$age.val(120);
  275. this.fv.validate();
  276. expect(this.fv.getMessages('age', 'lessThan')[0]).toEqual(format(i18n.lessThan['default'], 100));
  277. this.fv.resetForm();
  278. this.$website.val('http://invalidWebsite');
  279. this.fv.validate();
  280. expect(this.fv.getMessages('website', 'uri')[0]).toEqual(i18n.uri['default']);
  281. this.fv.resetForm();
  282. this.$phone.val('123456');
  283. this.fv.validate();
  284. expect(this.fv.getMessages('phoneNumber', 'phone')[0]).toEqual(format(i18n.phone.country, i18n.phone.countries['US']));
  285. this.fv.resetForm();
  286. this.$program.eq(0).prop('checked', 'checked');
  287. this.fv.validate();
  288. expect(this.fv.getMessages(this.$program, 'choice')[0]).toEqual(format(i18n.choice.between, [2, 4]));
  289. this.fv.resetForm();
  290. this.$program.prop('checked', 'checked');
  291. this.fv.validate();
  292. expect(this.fv.getMessages('programs[]', 'choice')[0]).toEqual(format(i18n.choice.between, [2, 4]));
  293. });
  294. });