Integrated browser "edit mode": use inline text edits as a signal for Copilot edits #310710 karlhorky opened 5 hours ago · edited by karlhorky When performing marketing copy edits, it is often faster to just change text copy directly in the integrated browser than to describe the change in chat and wait for Copilot to make the change and the dev server to update the integrated browser (especially true with slower dev servers). In the integrated browser, introduce a mode where DOM elements/nodes containing text are temporarily editable (eg. the behavior of contenteditable attribute). The user can then edit text inline and click on a "Save" button, upon which Copilot should use the diff of the edited text (plus nearby DOM context and innerHTML, as necessary) as a signal to propose source edits in the backing tsx / jsx / html / svelte / vue / etc file. This proposal is NOT about persisting DOM edits deterministically to files. The browser would only be the interaction surface, while Copilot still generates normal source edits for review, based on the diff. This could be extended to other non-text edits in future, such as image paths. Alternatives considered Full WYSIWYG editor, mapping changes to source files deterministically cc @meganrogge @jruales @kycutler
VS Code: I suggested an "edit mode" for the integrated browser, for WYSWYG-style workflows of changing text copy
If you also want this: it is a backlog candidate now, needs 20 👍 reactions to move it to backlog
github.com/microsoft/vs...
![alias npx-safe='function _npx_safe() {
local node_opts="--permission --allow-fs-read=$(npm prefix -g) --allow-fs-read=$(npm config get cache)"
local package=""
local package_args=()
while [[ $# -gt 0 ]]; do
if [[ "$1" == --* ]]; then
# Anything starting with `--` goes into node_opts
node_opts+=" $1"
else
# The first non-`--` argument is the package; the rest are package args
if [[ -z "$package" ]]; then
package="$1"
else
package_args+=("$1")
fi
fi
shift
done
echo "============================="
echo " npx-safe Log "
echo "============================="
echo "Node.js options:"
echo " $node_opts"
echo
echo "Package:"
echo " $package"
echo
if [[ ${#package_args[@]} -gt 0 ]]; then
echo "Arguments:"
for arg in "${package_args[@]}"; do
echo " $arg"
done
echo
fi
echo "============================="
npx --node-options="$node_opts" "$package" "${package_args[@]}"
}; _npx_safe'](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:b3xwbnwkl5qzjjhkwoimvb6x/bafkreif5l4ryqge3ybrwgdrxdv4666pky5cgicxkohru7f3hw3ow7b6rae)
