Highlight the solution code that users have to complete

[galeyang]

From recent two studies, participants are interested in seeing the suggested solution after passing the code.

User quote:

Even I successfully passed the test, I'm interested to see there's any difference between my syntax and syntax that google sending me. Maybe I learn something, e.g. the shorthand. So I like the second tab design (instead of replacing my current code)

It might be helpful to highlight the code that users are asked to write in the solution code so that it's easier to scan the answer.

This can be done in two possible ways:

1. automatically adding background color
2. let exercise's author to decide which part to highlight. This may be achieve when this feature is implemented: Highlight the background of important code Highlight the background of important code #1116

--
Another idea mentioned to make comparing easier is code difference. This is more complicate. We may file another issue to track it.

User quote:

I was almost hoping that it would maybe like show differences between the code but I don't know how useful that would be just in case somebody typed like really really different code.

Feedback welcome!

---

Status of this issue is also tracked in https://github.com/orgs/flutter/projects/3.

[RedBrogdon]

We can look into adding to DartPad for this. In the short term, exercise authors can always add extra code comments to the solution in order to point out the sections of the code that are different.

[parlough]

As part of the new, simplified version of the DartPad frontend, the exercise functionality this was related to was removed.

If anyone would like to see similar functionality brought back, please check out #2702 or open a new issue. Thanks so much!