impr(dom utils): add slideUp and slideDown utils (@miodec)

[Miodec]

!nuf

[Copilot]

Pull request overview

This PR adds slideUp and slideDown utility methods to the ElementWithUtils class for animated height transitions, along with an isHidden helper method. These utilities replace jQuery's slideDown/slideUp animations in the settings and replay modules.

• Added slideDown, slideUp, and isHidden methods to ElementWithUtils class
• Migrated settings group toggle animations from jQuery to new utilities
• Migrated replay display toggle animations from jQuery to new utilities

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 6 comments.

File	Description
frontend/src/ts/utils/dom.ts	Added isHidden(), slideDown(), and slideUp() animation utility methods to ElementWithUtils class
frontend/src/ts/test/replay.ts	Replaced jQuery slideDown/slideUp with new utilities in replay toggle functionality
frontend/src/ts/pages/settings.ts	Replaced jQuery animate/slideDown/slideUp with new utilities in settings group toggle

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Pull request overview

Copilot reviewed 7 out of 7 changed files in this pull request and generated 5 comments.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Pull request overview

Copilot reviewed 7 out of 7 changed files in this pull request and generated 3 comments.

Comments suppressed due to low confidence (1)

frontend/tests/setup-tests.ts:73

• The mock for ElementWithUtils is missing the isHidden() method that was added in this PR. This will cause test failures when code using isHidden() is tested. Add isHidden: vi.fn().mockReturnValue(false) to the mock object.

  const createMockElement = (): ElementWithUtils => {
    return {
      disable: vi.fn().mockReturnThis(),
      enable: vi.fn().mockReturnThis(),
      isDisabled: vi.fn().mockReturnValue(false),
      getAttribute: vi.fn(),
      hasAttribute: vi.fn().mockReturnValue(false),
      setAttribute: vi.fn().mockReturnThis(),
      removeAttribute: vi.fn().mockReturnThis(),
      isChecked: vi.fn().mockReturnValue(false),
      hide: vi.fn().mockReturnThis(),
      show: vi.fn().mockReturnThis(),
      addClass: vi.fn().mockReturnThis(),
      removeClass: vi.fn().mockReturnThis(),
      hasClass: vi.fn().mockReturnValue(false),
      toggleClass: vi.fn().mockReturnThis(),
      on: vi.fn().mockReturnThis(),
      onChild: vi.fn().mockReturnThis(),
      setHtml: vi.fn().mockReturnThis(),
      setText: vi.fn().mockReturnThis(),
      remove: vi.fn(),
      setStyle: vi.fn().mockReturnThis(),
      getStyle: vi.fn().mockReturnValue({}),
      isFocused: vi.fn().mockReturnValue(false),
      qs: vi.fn().mockImplementation(() => createMockElement()),
      qsr: vi.fn().mockImplementation(() => createMockElement()),
      qsa: vi.fn().mockImplementation(() => new ElementsWithUtils()),
      empty: vi.fn().mockReturnThis(),
      appendHtml: vi.fn().mockReturnThis(),
      append: vi.fn().mockReturnThis(),
      prependHtml: vi.fn().mockReturnThis(),
      dispatch: vi.fn().mockReturnThis(),
      offset: vi.fn().mockReturnValue({ top: 0, left: 0 }),
      wrapWith: vi.fn().mockImplementation(() => createMockElement()),
      setValue: vi.fn().mockReturnThis(),
      getValue: vi.fn().mockReturnValue(""),
      getParent: vi.fn().mockImplementation(() => createMockElement()),
      replaceWith: vi.fn().mockReturnThis(),
      getOffsetWidth: vi.fn().mockReturnValue(0),
      getOffsetHeight: vi.fn().mockReturnValue(0),
      getOffsetTop: vi.fn().mockReturnValue(0),
      getOffsetLeft: vi.fn().mockReturnValue(0),
      animate: vi.fn().mockResolvedValue(null),
      promiseAnimate: vi.fn().mockResolvedValue(null),
      slideUp: vi.fn().mockResolvedValue(null),
      slideDown: vi.fn().mockResolvedValue(null),
      native: document.createElement("div"),
      // @ts-expect-error - mocking private method
      hasValue: vi.fn().mockReturnValue(false),
    };

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.