Как работает визуальный редактор в Cursor
Теперь при запуске любой команды, слушающей какой-либо порт, Cursor предлагает открыть его в встроенном браузере, с возможностью выделения и редактирования контента на сайте - от текста до стилей, и даже абсолютного позиционирования.
При внесении изменений появляется кнопка Apply
Это всё дело помещается в контест чата и агент старается привести код проекта к указанному состоянию.
Пример:
Я просто выделил span, и убрал у него в стилях значение white-space, а получил огромный промпт с кучей правил и огромным селектором.
А как решение, на GPT-5.1-codex-mini (medium) я получил не самый хороший результат, но рабочий:
Модель не прямо следовала указаниям, а правильно поняла намерение. Не остановилась на том, что white-space нет в стилях (это стили библиотеки), а поняла что я хочу включить перенос строк.
Нашла компонент, CSS класс элемента и добавила в него вложенные стили в соответсвии с прописанными Cursor Rules.
Но результат получился не очень... (см скрин) Надо бы и с высотой поработать.
Что еще хуже: Изменение было применено к ui компоненту, что приведет к изменениям на всём сайте полностью.
А требуется лишь изменение частного случая...
Это уже не совсем полноценный агент, а буквально "умный" редактор сайтов, который будет сам чот себе там думать, но выполнит просьбу не докапываясь, в отличие от настоящего разработчика.
А настоящие редакторы сайтов обычно для каждого элемента имеют свой стейт, и почти никогда не предоставляют компонентный подход с переиспользованием.
Хотел рассказать о том как сделать лучше, но в процессе выяснил, что мне не нравится структура кнопки в библиотеке, и надо думать самому) Ну я так считаю, а в целом можно попробовать с ИИ решить проблему, но я думаю на это уйдет много времени и токенов.
Думаю основная проблема в ошибках на истоке проекта, я вообще против любых фиксированных размеров, а тут кнопки с фикс высотой...
Post #993
101

- ⚡ 3