feat: Vue.js Integration TG-371

tolgee · Nov 4, 2021 · 3486110 · 3486110
1 parent 8f55182
commit 3486110
Show file tree

Hide file tree

Showing 51 changed files with 44,404 additions and 26 deletions.
diff --git a/build.gradle b/build.gradle
@@ -97,6 +97,13 @@ task buildReact(type: Exec) {
     mustRunAfter "buildCore", "buildUi"
 }
 
+task buildVue(type: Exec) {
+    dependsOn "lernaBootstrap"
+    commandLine "npm", "run", "build"
+    workingDir "packages/vue"
+    mustRunAfter "buildCore", "buildUi"
+}
+
 task buildNgx(type: Exec) {
     dependsOn "lernaBootstrap"
     commandLine "npm", "run", "build"
@@ -135,6 +142,13 @@ task buildReactTestapps(type: Exec) {
     mustRunAfter "buildCore", "buildUi"
 }
 
+task buildVueTestapps(type: Exec) {
+    dependsOn "lernaBootstrap", "buildCore", "buildUi"
+    commandLine "npm", "run", "build"
+    workingDir "testapps/vue"
+    mustRunAfter "buildCore", "buildUi"
+}
+
 task buildNgxTestapps(type: Exec) {
     dependsOn "lernaBootstrap", "buildCore", "buildUi", "buildNgx"
     commandLine "npm", "run", "build"
@@ -159,15 +173,19 @@ task buildNextTestapps(type: Exec) {
 }
 
 task buildAll(type: Task) {
-    dependsOn "buildCore", "buildUi", "buildReact", "buildNgx", "buildSocketIoClient",
-            "buildCoreTestapps", "buildReactTestapps", "buildNgxTestapps", "buildGatsbyTestapps", "buildNextTestapps"
+    dependsOn "buildCore", "buildUi", "buildReact", "buildVue", "buildNgx", "buildSocketIoClient",
+            "buildCoreTestapps", "buildReactTestapps", "buildVueTestapps", "buildNgxTestapps", "buildGatsbyTestapps", "buildNextTestapps"
 }
 
 task developAll(type: Exec) {
     dependsOn "lernaBootstrap", "buildAll"
     commandLine "lerna", "run", "--parallel", "develop"
 }
 
+task developAllNoBuild(type: Exec) {
+    commandLine "lerna", "run", "--parallel", "--include-dependencies", "develop"
+}
+
 task developReactNoBuild(type: Exec) {
     commandLine "lerna", "run", "--parallel", "--include-dependencies", "--scope", "*/react", "develop"
 }
@@ -197,6 +215,11 @@ task testSocketIoClient(type: Exec) {
     workingDir "packages/socketio-client"
 }
 
+task testVue(type: Exec) {
+    commandLine "npm", "run", "test"
+    workingDir "packages/vue"
+}
+
 task build(type: Task) {
-    dependsOn "buildAll", "testUi", "testCore", "testReact", "testSocketIoClient", "runE2e"
+    dependsOn "buildAll", "testUi", "testCore", "testReact", "testSocketIoClient", "testVue", "runE2e"
 }
diff --git a/e2e/cypress/integration/next/ui.spec.ts b/e2e/cypress/integration/next/ui.spec.ts
@@ -100,7 +100,7 @@ context('UI Dialog', () => {
     ]);
     openUI();
     getByAriaLabel('Take screenshot').should('be.visible').click();
-    getByAriaLabel('Screenshot').should('be.visible').trigger('mouseover');
+    getByAriaLabel('Screenshot').should('be.visible');
     cy.contains('Update').click();
 
     openUI();
@@ -119,7 +119,7 @@ context('UI Dialog', () => {
       .trigger('mouseover')
       .click();
     cy.get('textarea').contains(translation).should('be.visible');
-    cy.wait(100);
+    cy.wait(300);
   };
 
   const removeScreenshots = () => {

diff --git a/e2e/cypress/integration/vue/base.spec.ts b/e2e/cypress/integration/vue/base.spec.ts
@@ -0,0 +1,22 @@
+context('Base test', () => {
+  beforeEach(() => {
+    cy.visit('http://localhost:8108/');
+  });
+
+  it('it translates', () => {
+    cy.contains('Hello world!');
+  });
+
+  it('it switches language', () => {
+    cy.get('select').select('de');
+    cy.contains('Hallo Welt!');
+  });
+
+  it('shows default value when provided ', () => {
+    cy.contains('This is default').should('be.visible');
+  });
+
+  it('shows key as default when default not provided ', () => {
+    cy.contains('unknown key').should('be.visible');
+  });
+});
diff --git a/e2e/docker-compose.yml b/e2e/docker-compose.yml
@@ -23,7 +23,7 @@ services:
       - '../testapps/core:/data'
     ports:
       - 8101:8101
-    command: [ 'npm', 'run', 'serve' ]
+    command: ['npm', 'run', 'serve']
     working_dir: /data
   e2e_app_react:
     container_name: tolgee_js_e2e_serve_testapps_react
@@ -32,7 +32,7 @@ services:
       - '../:/data'
     ports:
       - 8102:8101
-    command: [ 'npm', 'run', 'serve' ]
+    command: ['npm', 'run', 'serve']
     working_dir: /data/testapps/react
   e2e_app_angular:
     container_name: tolgee_js_e2e_serve_testapps_ngx
@@ -41,7 +41,7 @@ services:
       - '../:/data'
     ports:
       - 8103:8101
-    command: [ 'npm', 'run', 'serve' ]
+    command: ['npm', 'run', 'serve']
     working_dir: /data/testapps/ngx
   e2e_app_gatsby_dev:
     container_name: tolgee_js_e2e_serve_testapps_gatsby_dev
@@ -50,7 +50,7 @@ services:
       - '../:/data'
     ports:
       - 8104:8000
-    command: [ 'npm', 'run', 'start', '--', '--host=0.0.0.0' ]
+    command: ['npm', 'run', 'start', '--', '--host=0.0.0.0']
     environment:
       GATSBY_TOLGEE_API_URL: http://localhost:8202
       GATSBY_TOLGEE_API_KEY: this_is_dummy_api_key
@@ -62,7 +62,7 @@ services:
       - '../:/data'
     ports:
       - 8105:9000
-    command: [ 'npm', 'run', 'serve', '--', '--host=0.0.0.0' ]
+    command: ['npm', 'run', 'serve', '--', '--host=0.0.0.0']
     working_dir: /data/testapps/gatsby
   e2e_app_next_dev:
     container_name: tolgee_js_e2e_serve_testapps_next_dev
@@ -71,7 +71,7 @@ services:
       - '../:/data'
     ports:
       - 8106:3000
-    command: [ 'npm', 'run', 'dev' ]
+    command: ['npm', 'run', 'dev']
     environment:
       NEXT_PUBLIC_TOLGEE_API_URL: http://localhost:8202
       NEXT_PUBLIC_TOLGEE_API_KEY: this_is_dummy_api_key
@@ -83,7 +83,16 @@ services:
       - '../:/data'
     ports:
       - 8107:3000
-    command: [ 'npm', 'run', 'start' ]
+    command: ['npm', 'run', 'start']
     environment:
       NEXT_BUILD_DIR: dist
     working_dir: /data/testapps/next
+  e2e_app_vue:
+    container_name: tolgee_js_e2e_serve_testapps_vue
+    build: ../docker
+    volumes:
+      - '../:/data'
+    ports:
+      - 8108:3002
+    command: ['npm', 'run', 'serve']
+    working_dir: /data/testapps/vue