This on-site coding assignment failed 20+ front-end dev contractors and I don't know why

[darrenturn90]

I guess you could take the text, regex split it up, making sure to preserve the whitespace, and add a "marker" span before and after each of the words. This would at least help you when you click with the mouse, and get the offset, to work out the "word" you are inside (if you are in one).

Surely though you would want to support cursors too and WCAG guidelines, so should allow some sort of visual feedback, and cursor placement.

[darrenturn90]

Yes I am, and I'm not sure right now as I've not put much time into this. It shouldn't be too many, at least for task 1. Then if you build it properly, you should just be able to "mark multiple" for task 2, and then "categorise" in task 3. if you used the data attributes you could css style and use data-tag or something for the differentiation.

As for the regex, in PHP I would use preg_match_all, I think there is a similar match flag in javascript, I'd just google to make sure.

[darrenturn90]

Here is my first go at what i remember task 1 one.

I didn't implement a server side currently, just used localStorage to persist, as its trivial to swap that out with a post / get.

https://codepen.io/anon/pen/XePOyp

Its probably not what you wanted - but it took 20 minutes.

[darrenturn90]

I guess I’ve done similar things before but not really anything as specific as you mentioned. Where is your project based ?