[Remove Vuetify from Studio] Convert Sign In page unit tests to Vue Testing Library

[MisRob]

🙂 Looking for an issue? Welcome! This issue is open for contribution. If this is the first time you’re requesting an issue, please:

• Read Contributing guidelines carefully. Pay extra attention to Using generative AI. Pull requests and comments that don’t follow the guidelines won’t be answered.
• Confirm that you’ve read the guidelines in your comment.

Sub-issue of https://github.com/learningequality/studio/issues/5060.

Complexity: Low

Summary

The test suite accounts/pages/__tests__/accountsMain.spec.js currently relies heavily on internal implementation details and uses Vue Test Utils in a way that couples tests tightly to component internals. This creates several issues:

• Brittle and unreliable tests (break when implementation changes even if behavior remains correct, or incorrectly pass while actual user interactions fail)
• Maintenance burden (refactoring component's internal code requires updating tests)

Refactor the test suite to use Vue Testing Library (VTL), which enforces testing components the way users interact with them.

Value Add

Prepares the test suite for easier and meaningful updates during the upcoming refactoring to remove Vuetify from this page.

Guidance

• Navigate to /accounts and familiarize yourself with the page functionality as a user

• Familiarize yourself with Testing Library principles
• Follow our Unit testing guide and Testing template, where you will also find how we mock router, store, composables, and more.
• Follow Testing Library query priority recommendation
• Search for from '@testing-library/vue' to find existing VTL test suites

Acceptance criteria

• [ ] All major workflows are covered while avoiding excessive testing of details
• [ ] Test descriptions are clear and document the behavior from the user perspective

[kart-u]

@MisRob can you please assign this to me i would like to work on this.

[bjester]

@kart-u Are you still working on #5521?

[kart-u]

@bjester yes just waiting for #5472 to merge as I have to make changes in KModal component to resolve #5521

[Gopisokk]

@MisRob I have read the Contributing guidelines I'd like to work on this issue

[bjester]

@kart-u I left you a message on your PR #5522. You can move forward with #5521 by basing your work off your the branch in #5522, then rebase that work after #5522 is merged.

@Gopisokk I will assign you this issue. Thank you for your interest

[Gopisokk]

Thank you @bjester

[harshbarnwal0101]

@bjester can you assign this issue i would really like to work on this.

[suji7724]

Hi, I’d like to work on this issue.

My plan is to refactor the accountsMain.spec.js test suite to use Vue Testing Library (VTL) instead of Vue Test Utils. This will focus the tests on user interactions and visible behavior rather than component internals.

I’ll replace direct access to component data or methods with VTL queries .This will makes the tests more maintainable.

Please let me know if I can proceed!

[vtushar06]

Hii @suji7724, as you can see Gopisokk is currently assigned, can you look into some other issue,and Please read contributing guidelines before start contributing.

[Gopisokk]

Hi @bjester

I opened the PR for this issue:

https://github.com/learningequality/studio/pull/5553

let me know if any changes are needed. Thank you!

[bjester]

Okay, thank you @Gopisokk. We'll schedule it for review in the coming weeks.

[anoopalase29]

Hi! I would like to work on this issue. Can I take this up?

[bjester]

@anoopalase29 This issue is already assigned. To find out how to contribute, visit Contributing to our open code base.

[vtushar06]

Hii @MisRob, Can I work on this issue, as this issue follows #5536 approaches, I have learned very much from that issues and I think I can resolve this one.

[MisRob]

Thank you @vtushar06 - yes please try to apply all the feedback and I think it should go well.

[LianaHarris360]

Closed by #5576