test(shared): add unit tests for BranchDropdown component

[sabhi128]

Summary of Changes

This PR adds unit test coverage for the BranchDropdown shared component under frontend/src/components/shared/.

Changes:

• New File: frontend/src/components/__tests__/shared/BranchDropdown.spec.js
  • Validates component mounting.
  • Verifies location pathname parsing and dynamic branch API querying.
  • Tests branch selection emission (changeBranch) and store resets (resetFileNotFound).
  • Asserts automatic default branch fallback when the active branch prop does not exist in the fetched branch list.

[Copilot]

Pull request overview

Adds Vitest unit coverage for the shared BranchDropdown Vue component to validate branch fetching and selection behavior on mount and user interaction.

Changes:

• Adds a new spec file for BranchDropdown under frontend/src/components/__tests__/shared/.
• Introduces mocks for useFetchApi and useRepoTabStore to drive deterministic branch-list behavior.
• Adds assertions around emitted changeBranch events and store resets.

Suppressed comments (2)

frontend/src/components/tests/shared/BranchDropdown.spec.js:51

• PR description mentions verifying pathname parsing / dynamic branch API querying, but the test only checks that json() was called (and does so before awaiting mount effects). Consider asserting the actual URL passed to useFetchApi after awaiting pending promises, and reset the captured request log between tests to avoid cross-test bleed.

  beforeEach(async () => {
    getApiMockFn.mockClear();
    mockResetFileNotFound.mockClear();

    wrapper = mount(BranchDropdown, {
      props: {
        currentBranch: "main"
      }
    });
  });

  it("mounts correctly", () => {
    expect(wrapper.exists()).toBe(true);
  });

  it("fetches branches on mount and resolves them", async () => {
    expect(getApiMockFn).toHaveBeenCalled();
    await flushPromises();
    expect(wrapper.vm.branches).toEqual([{ name: "main" }, { name: "dev" }]);
  });

frontend/src/components/tests/shared/BranchDropdown.spec.js:58

• This test says "when clicked" but it calls handleClick() directly, so it doesn’t validate that the template wiring (@click="handleClick(branch.name)") actually works. Trigger a click on the rendered dropdown item instead.

  it("triggers changeBranch event and resets file not found state when clicked", async () => {
    await flushPromises();
    await wrapper.vm.handleClick("dev");
    expect(wrapper.emitted().changeBranch[0]).toEqual(["dev"]);
    expect(mockResetFileNotFound).toHaveBeenCalled();
  });

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.