0 Prepending Messages to ChatGPT Prompts with JavaScript.md

Prepending Messages to ChatGPT Prompts with JavaScript

This article explains a simple JavaScript snippet that automatically prepends a fixed message to the ChatGPT prompt input field. The goal is to enforce a consistent instruction—such as asking ChatGPT to always generate Git commit messages in English—without manually typing it every time.

---

How the Script Works

The script is wrapped in an Immediately Invoked Function Expression (IIFE) so it runs as soon as it is loaded. Inside, it follows these steps:

1. Define the prepend message

   let prependMessageHTML = "<p>Write a Git commit message in English based on the received changes.<br/>----<br/></p>";

   This is the HTML snippet that will be inserted before the user’s input. It ensures every prompt begins with a clear instruction.

2. Access the ChatGPT input field

   let promptTextarea = document.querySelector("#prompt-textarea");

   The script locates the text area where prompts are typed.

3. Save the current content

   const savedMessageHTML = promptTextarea.innerHTML;
   const savedMessageText = promptTextarea.innerText;

   This ensures the user’s input is preserved and not overwritten.

4. Check and insert the prepend message

   if (!savedMessageText.startsWith(prependMessageText)) {
       promptTextarea.innerHTML = prependMessageHTML + savedMessageHTML;
   } else {
       promptTextarea.innerHTML = savedMessageHTML;
   }

   • If the prompt doesn’t already begin with the prepend text, the script adds it.
   • If it already exists, the prepend is removed to avoid duplication.

---

Key Benefits

• Consistency: Ensures ChatGPT always receives the same initial instruction.
• Automation: Saves time by eliminating repetitive typing.
• Flexibility: Easy to modify the prepend message for other use cases (e.g., always respond in JSON, always summarize, etc.).

---

Example Use Case

With this script, when you type changes into ChatGPT, the model will always receive the instruction:

“Write a Git commit message in English based on the received changes.”

This is particularly useful in development workflows where uniform commit messages are required.

main.js

(function() {
    let prependMessageHTML = "<p>Write a Git commit message in English based on the received changes.<br/>----<br/></p>";
    let promptTextarea = document.querySelector("#prompt-textarea");
    const savedMessageHTML = promptTextarea.innerHTML;
    const savedMessageText = promptTextarea.innerText;// .replaceAll("\n", "");
    promptTextarea.innerHTML = prependMessageHTML;
    const prependMessageText = promptTextarea.innerText;
    if (!savedMessageText.startsWith(prependMessageText)) {
        promptTextarea.innerHTML = prependMessageHTML + savedMessageHTML;
    } else {
        promptTextarea.innerHTML = savedMessageHTML;
    }
})();

main.min.js

!function(){let prependMessageHTML="Write a Git commit message in English based on the received changes.<br/>----<br/>",tmp=document.createElement("div");tmp.setAttribute("contenteditable",!0);let promptTextarea=document.querySelector("#prompt-textarea");const savedMessageHTML=promptTextarea.innerHTML,savedMessageText=promptTextarea.innerText;tmp.innerHTML=prependMessageHTML;const prependMessageText=tmp.innerText;savedMessageText.startsWith(prependMessageText)?promptTextarea.innerHTML=savedMessageHTML:promptTextarea.innerHTML=prependMessageHTML+savedMessageHTML}();