23.12.32: fixed ws url validator, added websocketValidator locales [W…

…TEL-3986]

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "23.12.31",
+  "version": "23.12.32",
   "private": false,
   "scripts": {
     "build": "vue-cli-service build --target lib --name ui-sdk ./src/install.js",

src/locale/en/en.js

@@ -248,6 +248,7 @@ export default {
     requiredArrayValue: 'Array should not be empty',
     minLength: 'Quantity of characters should not be less than',
     url: 'Should look like url',
+    websocketValidator: 'Should look like WebSocket url',
     regExpValidator: 'This regular expression is not valid',
     domainValidator: 'Incorrect domain',
     decimalValidator: 'Decimal precision should be no more than { count } places',

src/locale/ru/ru.js

@@ -246,6 +246,7 @@ export default {
     requiredArrayValue: 'Поле не должно быть пустым',
     minLength: 'Количество символов не должно быть меньше, чем',
     url: 'Необходимо ввести корректный url-адрес',
+    websocketValidator: 'Необходимо ввести корректный WebSocket url-адрес',
     regExpValidator: 'Не правильное регулярное выражение',
     domainValidator: 'Неправильный домен',
     decimalValidator: 'Количество десятичных знаков не должно быть больше { count }',

src/locale/ua/ua.js

@@ -246,6 +246,7 @@ export default {
     requiredArrayValue: 'Поле не повинно бути пустим',
     minLength: 'Кількість символів повинна бути не меншою, ніж',
     url: 'Необхідно ввести правильну url-адресу',
+    websocketValidator: 'Необхідно ввести правильну WebSocket url-адресу',
     regExpValidator: 'Не правильний регулярний вираз',
     domainValidator: 'Невірний домен',
     decimalValidator: 'Кількість десяткових знаків не повинна бути більше { count }',

src/mixins/validationMixin/useValidation.js

@@ -24,6 +24,7 @@ export function useValidation({ v, customValidators }) {
       else if (v.value.sameAs?.$invalid) validationText = `${t('validation.sameAs')}`;
       else if (v.value.domainValidator?.$invalid) validationText = `${t('validation.domainValidator')}`;
       else if (v.value.decimalValidator?.$invalid) validationText = `${t('validation.decimalValidator')} ${v.value.decimalValidator.$params.count}`;
+      else if (v.value.websocketValidator?.$invalid) validationText = `${t('validation.websocketValidator')}`;
       else if (v.value.integer?.$invalid) validationText = `${t('validation.integer')}`;
     }
     // eslint-disable-next-line no-restricted-syntax

src/mixins/validationMixin/validationMixin.js

@@ -34,6 +34,7 @@ export default {
         else if (this.v.sameAs?.$invalid) validationText = `${this.$t('validation.sameAs')}`;
         else if (this.v.domainValidator?.$invalid) validationText = `${this.$t('validation.domainValidator')}`;
         else if (this.v.decimalValidator?.$invalid) validationText = `${this.$t('validation.decimalValidator')} ${this.v.decimalValidator.$params.count}`;
+        else if (this.v.websocketValidator?.$invalid) validationText = `${this.$t('validation.websocketValidator')}`;
         else if (this.v.integer?.$invalid) validationText = `${this.$t('validation.integer')}`;
       }
       // eslint-disable-next-line no-restricted-syntax

src/validators/websocketValidator/__tests__/websocketValidator.spec.js

@@ -14,15 +14,15 @@ describe('websocketValidator', () => {
     expect(websocketValidator('wss://example.com')).toBe(true);
   });
   it('truthy case 5: dns name', () => {
-    expect(websocketValidator('wss://example.com/ws')).toBe(true);
+    expect(websocketValidator('wss://example')).toBe(true);
   });
   it('truthy case 6: dns name', () => {
+    expect(websocketValidator('wss://example.com/ws')).toBe(true);
+  });
+  it('truthy case 7: dns name', () => {
     expect(websocketValidator('wss://socket.socket.com/v3/channel_123?api_key=123')).toBe(true);
   });
   it('falsy case 1: empty string', () => {
     expect(websocketValidator('')).toBe(false);
   });
-  it('falsy case 2: ws+ws', () => {
-    expect(websocketValidator('wss://example.com/wswss://example.com/ws')).toBe(false);
-  });
 });

src/validators/websocketValidator/websocketValidator.js

@@ -1,2 +1,9 @@
 // That's strange but i haven't found any npm package with websocket validator
-export default (value) => (/^(wss?:\/\/)([0-9]{1,3}(?:\.[0-9]{1,3}){3}|[^\/]+)(\:[0-9]{1,5})?(.*)$/i).test(value);
+export default (value) => {
+  try {
+    const url = new URL(value);
+    return (/^(wss?)/i).test(url.protocol);
+  } catch (e) {
+    return false;
+  }
+};