Skip to content

Added direct Submission for CodeChef & Atcoder with CPH creating codeChefInjectedScript and atcoderInjectedScript - #40

Open
sachin-prmndani wants to merge 11 commits into
agrawal-d:masterfrom
sachin-prmndani:codeChef-sbmt-btn
Open

Added direct Submission for CodeChef & Atcoder with CPH creating codeChefInjectedScript and atcoderInjectedScript#40
sachin-prmndani wants to merge 11 commits into
agrawal-d:masterfrom
sachin-prmndani:codeChef-sbmt-btn

Conversation

@sachin-prmndani

@sachin-prmndani sachin-prmndani commented Jun 8, 2026

Copy link
Copy Markdown
Contributor

feat: Add CodeChef & Atcoder Direct Submission Support

closes #41

Overview

This PR introduces direct problem submission support for CodeChef & Atcoder in CPH, compatible with both Chrome (Manifest V3) and Firefox.

Problem

CodeChef & Atcoder uses the Ace editor, which enforces a strict Content Security Policy (CSP) that prevents direct script injection via Chrome's Manifest V3. This required a non-standard approach to interact with the editor programmatically.

Solution

for codehef:
To bypass the CSP restriction, source code is pushed directly into the page's main world memory rather than injected as a script. To bypass React's state isolation, we implemented a "human-simulation" approach . The script dispatches full native mouse event lifecycles (mouseover, mousedown, mouseup, click) to interact with the Material-UI dropdowns, forcing React to register the interactions and update its internal state accordingly.

for Atcoder:
we mapped the compiler ids to atcoder select options. Added cloudFareVerificationChecker() to constantly poll for verification for 4 times in every second, as soon as it finds the cloudfare token it auto submits the problem.

Workflow

  1. handleSubmit.ts detects a CodeChef or Atcoder problem and triggers codechefInjectedScript.ts or 'atcoderInjectedScript.ts'
  2. The script selects the appropriate compiler language based on the user's setting
    3.After a brief wait for the React portal to render, it locates the target language via data-value matching and simulates a click to select it.
    4.The script waits for the UI animation to close and the internal React state to lock.
    5.Source code is injected directly into the main world's ace editor instance.
    6.final simulated click triggers the "Submit" button

Changes

  • Added codechefInjectedScript.ts — handles language selection and source code injection
  • Added 'atcoderInjectedScript.ts' — handles language selection and source code injection
  • Updated handleSubmit.ts — added CodeChef , Atcoder submission handler
  • Updated manifest.json — added required host permissions for CodeChef and Atcoder

Notes

  • Timeouts are intentional and necessary due to CodeChef's React render cycle
  • Tested on both Chrome (MV3) and Firefox

CodeChef:
https://github.com/user-attachments/assets/5c797f9b-c523-4b14-a387-0a2ddbd98bfc

Atcoder:

2026-06-13.22-06-34.mp4

@sachin-prmndani sachin-prmndani changed the title Added direct Submission for CodeChef with CPH creating codeChefInjectedScript Added direct Submission for CodeChef & Atcoder with CPH creating codeChefInjectedScript and atcoderInjectedScript Jun 13, 2026
@sachin-prmndani

Copy link
Copy Markdown
Contributor Author

Hi @agrawal-d , just wanted to gently follow up on this PR. I've also pushed several improvements since opening it and tested on practice and live contests as well. When you have time, I'd appreciate any feedback or review. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature Request] Add AtCoder submission support

1 participant