Page MenuHomePhabricator

Migrate Section translation to Vue 3
Closed, ResolvedPublic8 Estimated Story Points

Description

Section translation currently uses Vue 2.x. To align with Vue usage in mediawiki T289017: <Core Technology> Upgrade MediaWiki projects from Vue 2 to Vue 3, and to use the benefits of Vue's latest version, we need to migrate to latest stable version - Vue 3.x

This would also mean, migrating to Vuex 4.x and Vue router 4.x

Checklist

  • Upgrade Vue to 3.x
  • Upgrate Vuex to 4.x
  • Upgrade Vue router to 4.x
  • Upgrade Vue banana i18n to Vue 3 version
  • Upgrade Vue-cli as needed
  • Explore replacement of Vue-cli/webpack with Vite

Details

ProjectBranchLines +/-Subject
mediawiki/extensions/ContentTranslationmaster+0 -7
mediawiki/extensions/ContentTranslationmaster+21 -17
mediawiki/extensions/ContentTranslationmaster+8 -8
mediawiki/extensions/ContentTranslationmaster+56 -44
mediawiki/extensions/ContentTranslationmaster+96 -67
mediawiki/extensions/ContentTranslationmaster+99 -68
mediawiki/extensions/ContentTranslationmaster+33 -19
mediawiki/extensions/ContentTranslationmaster+59 -38
mediawiki/extensions/ContentTranslationmaster+15 -22
mediawiki/extensions/ContentTranslationmaster+4 -4
mediawiki/extensions/ContentTranslationmaster+12 -12
mediawiki/extensions/ContentTranslationmaster+82 -62
mediawiki/extensions/ContentTranslationmaster+27 -22
mediawiki/extensions/ContentTranslationmaster+7 -7
mediawiki/extensions/ContentTranslationmaster+88 -120
mediawiki/extensions/ContentTranslationmaster+174 -134
mediawiki/extensions/ContentTranslationmaster+25 -21
mediawiki/extensions/ContentTranslationmaster+3 -4
mediawiki/extensions/ContentTranslationmaster+51 -46
mediawiki/extensions/ContentTranslationmaster+51 -34
mediawiki/extensions/ContentTranslationmaster+30 K -29 K
mediawiki/extensions/ContentTranslationmaster+31 K -21 K
mediawiki/extensions/ContentTranslationmaster+45 K -34 K
Show related patches Customize query in gerrit

Event Timeline

Change 767618 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] SX: Replace vue-cli with Vite

https://gerrit.wikimedia.org/r/767618

Change 767746 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] CX3: HMR + Vite tooling

https://gerrit.wikimedia.org/r/767746

santhosh raised the priority of this task from Medium to High.Mar 4 2022, 5:40 AM
santhosh set the point value for this task to 8.

Change 769846 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] Vite tooling: Fix dynamic import failures, support local config

https://gerrit.wikimedia.org/r/769846

Change 771351 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Explicitly inject dependencies inside composables

https://gerrit.wikimedia.org/r/771351

Change 771644 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Add Vue 3 with compatibility build

https://gerrit.wikimedia.org/r/771644

Change 771645 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Upgrade vue-router to v4

https://gerrit.wikimedia.org/r/771645

Change 771666 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Upgrade vuex to v4

https://gerrit.wikimedia.org/r/771666

Change 771667 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Fix breakpoints and colors plugins to be used with Vite + Vue3

https://gerrit.wikimedia.org/r/771667

Change 771668 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Refactor event logging plugin to be used with Vue 3

https://gerrit.wikimedia.org/r/771668

Change 771669 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX: Upgrade vue-banana-i18n for compatibility with Vue 3

https://gerrit.wikimedia.org/r/771669

Change 771829 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Replace Vue.set with regular JS mutations

https://gerrit.wikimedia.org/r/771829

Change 771830 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SXQuickTutorial Vue 3: Fix transitions to only contain a single child

https://gerrit.wikimedia.org/r/771830

Change 771832 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Use global nextTick instead of $nextTick

https://gerrit.wikimedia.org/r/771832

Change 771833 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Refactor MWRadioGroup to use Vue3 render API

https://gerrit.wikimedia.org/r/771833

Change 771834 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Refactor new section placeholder functionality

https://gerrit.wikimedia.org/r/771834

Change 771835 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue3 migration: Fix attributes with v-bind value false

https://gerrit.wikimedia.org/r/771835

Change 771836 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue3 migration: Replace slot attributes with new syntax

https://gerrit.wikimedia.org/r/771836

Change 771837 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue3 migration: Fix usage of v-model

https://gerrit.wikimedia.org/r/771837

Change 771877 had a related patch set uploaded (by Nik Gkountas; author: Nik Gkountas):

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Remove vue/compat build

https://gerrit.wikimedia.org/r/771877

Change 772393 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] Vue 3 + Jest migration

https://gerrit.wikimedia.org/r/772393

Change 773385 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] Migrate Section Translation to Vue 3

https://gerrit.wikimedia.org/r/773385

Change 773385 merged by jenkins-bot:

[mediawiki/extensions/ContentTranslation@master] Migrate Section Translation to Vue 3

https://gerrit.wikimedia.org/r/773385

Change 772393 abandoned by Santhosh:

[mediawiki/extensions/ContentTranslation@master] Vue 3 + Jest migration

Reason:

Merged with https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ContentTranslation/+/773385

https://gerrit.wikimedia.org/r/772393

Change 767618 abandoned by Santhosh:

[mediawiki/extensions/ContentTranslation@master] SX: Replace vue-cli with Vite

Reason:

Merged with https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ContentTranslation/+/773385

https://gerrit.wikimedia.org/r/767618

Change 767746 abandoned by Santhosh:

[mediawiki/extensions/ContentTranslation@master] CX3: HMR + Vite tooling

Reason:

Merged with https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ContentTranslation/+/773385

https://gerrit.wikimedia.org/r/767746

Change 769846 abandoned by Santhosh:

[mediawiki/extensions/ContentTranslation@master] Vite tooling: Fix dynamic import failures, support local config

Reason:

Merged with https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ContentTranslation/+/773385

https://gerrit.wikimedia.org/r/769846

https://sx.wmflabs.org/ is now running on Vue3, Vuex 4, Vue Router 4, Vue Banana i18n 2. Please help testing before it goes to production next week.

There should not be any UI/UX changes from previous version. Everything should work as it used to be.

https://sx.wmflabs.org/ is now running on Vue3, Vuex 4, Vue Router 4, Vue Banana i18n 2. Please help testing before it goes to production next week.

There should not be any UI/UX changes from previous version. Everything should work as it used to be.

On a first pass I found these regressions, which I added as sub-tasks:

The first one is more severe since prevents adding any content to the translation to continue the translation (and testing ) process.

Another issue I found during the testing process (T304679) does not seem to be due to refactoring since are also present in production or in Test Wikipedia

Change 774457 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] SX: MT fix - translateTranslationUnitById should be awaited

https://gerrit.wikimedia.org/r/774457

Change 774457 merged by jenkins-bot:

[mediawiki/extensions/ContentTranslation@master] SX: MT fix - translateTranslationUnitById should be awaited

https://gerrit.wikimedia.org/r/774457

Change 774507 had a related patch set uploaded (by Santhosh; author: Santhosh):

[mediawiki/extensions/ContentTranslation@master] CX3 Build 0.2.0+20220328

https://gerrit.wikimedia.org/r/774507

Change 774507 merged by jenkins-bot:

[mediawiki/extensions/ContentTranslation@master] CX3 Build 0.2.0+20220328

https://gerrit.wikimedia.org/r/774507

Change 771351 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Explicitly inject dependencies inside composables

Reason:

https://gerrit.wikimedia.org/r/771351

Change 771644 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Add Vue 3 with compatibility build

Reason:

https://gerrit.wikimedia.org/r/771644

Change 771832 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Use global nextTick instead of $nextTick

Reason:

https://gerrit.wikimedia.org/r/771832

Change 771833 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Refactor MWRadioGroup to use Vue3 render API

Reason:

https://gerrit.wikimedia.org/r/771833

Change 771834 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Refactor new section placeholder functionality

Reason:

https://gerrit.wikimedia.org/r/771834

Change 771835 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue3 migration: Fix attributes with v-bind value false

Reason:

https://gerrit.wikimedia.org/r/771835

Change 771830 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SXQuickTutorial Vue 3: Fix transitions to only contain a single child

Reason:

https://gerrit.wikimedia.org/r/771830

Change 771829 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Replace Vue.set with regular JS mutations

Reason:

https://gerrit.wikimedia.org/r/771829

Change 771669 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Upgrade vue-banana-i18n for compatibility with Vue 3

Reason:

https://gerrit.wikimedia.org/r/771669

Change 771668 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Refactor event logging plugin to be used with Vue 3

Reason:

https://gerrit.wikimedia.org/r/771668

Change 771667 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Fix breakpoints and colors plugins to be used with Vite + Vue3

Reason:

https://gerrit.wikimedia.org/r/771667

Change 771666 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Upgrade vuex to v4

Reason:

https://gerrit.wikimedia.org/r/771666

Change 771645 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX: Upgrade vue-router to v4

Reason:

https://gerrit.wikimedia.org/r/771645

Change 771836 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue3 migration: Replace slot attributes with new syntax

Reason:

https://gerrit.wikimedia.org/r/771836

Change 771837 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue3 migration: Fix usage of v-model

Reason:

https://gerrit.wikimedia.org/r/771837

Change 771877 abandoned by Nik Gkountas:

[mediawiki/extensions/ContentTranslation@master] SX Vue 3 migration: Remove vue/compat build

Reason:

https://gerrit.wikimedia.org/r/771877

Testing status: QA PASS

I was able to carry out the basic app launch and was able to perform simple article translations

Pginer-WMF claimed this task.