AI-Assisted Coding Interview Experience

The interview consisted of two practical frontend tasks on an existing React codebase which was a Travel App with nodejs backend, with GitHub Copilot like assistant provided but just for help. It will deny giving direct solution but will help in understanding codebase or any syntax. The focus was on debugging, understanding the existing architecture, and making incremental changes rather than building features from scratch. The main issue which i found was not having access to console. You can't debug by console logging.

1. Sorting Feature Debugging

• Debug and implement an apartment listing sorting feature supporting Price, Rating, and Title sorting. Sorting options will open in modal on sort button press.

• The existing implementation contained multiple intentionally introduced bugs, including:

  • Incorrectly destructured state variables.
  • Wrong state updates (e.g., storing sort direction in the sort type state).
  • Incorrect comparator logic (e.g., comparing titles when sorting by rating).
  • Other inconsistencies in the sorting implementation.

• Have to implement state persistence so the selected sorting option remained after navigating away and returning to the page. The project already contained a custom useLocalStorage hook, which could be reused, or candidates could implement their own persistence logic.

• Also had to update the UI to display the Sort button only on the homepage, which required understanding the existing routing and component hierarchy.

2. Accessibility Feature

• Need to add accessibility functionality to an existing page.

• Required implementing:

  • High Contrast Mode, toggled using keyboard shortcut '1'.
  • Keyboard Accessibility Mode, toggled using keyboard shortcut '2'.

• The codebase already contained wrapper/provider components for contrast and keyboard accessibility, but they were only partially implemented. The task was to integrate and complete the existing architecture rather than build a new solution from scratch.

Overall Experience

The interview primarily evaluated the ability to:

• Debug an unfamiliar React codebase.
• Understand and extend the existing architecture.
• Reuse existing hooks, wrappers, and utilities.
• Manage React state and persistence.
• Follow React best practices and maintainable design patterns.
• Effectively use AI tools (such as GitHub Copilot) for code navigation, reasoning, and debugging rather than relying solely on code generation.

One practical tip: The biggest challenge wasn't implementing features—it was identifying intentionally introduced bugs. Don't assume the existing code is correct or try to guess where the bugs are. First, spend a few minutes understanding the expected flow of the feature (state, handlers, effects, and data flow). Once you know how the feature should work, the incorrect wiring, wrong state updates, and misplaced logic become much easier to spot. You can ask the same to AI assistant as well.