How can I add another line to an existing line - using JavaScript?

Question

Problem: I am writing some functional tests using Selenium - C#. I have to add two CSS lines in the code-mirror textarea. It seems like I can only do it using Javascript in my C# code by targeting the main "div" with class = CodeMirror. i.e. shown in this image

But when I do it using this code:

  IJavaScriptExecutor js = (IJavaScriptExecutor) Driver;

        string ExistingCSS=null;

        for (int i = 0; i < table.RowCount; i++)
        {
            ScrollIntoView(Driver.FindElement(By.ClassName("CodeMirror")));
            ExistingCSS = ExistingCSS + Driver.FindElement(By.ClassName("CodeMirror")).FindElements(By.ClassName("CodeMirror-line"))[i].Text;
            Console.WriteLine(" Existing CSS -> "+ ExistingCSS);

            js.ExecuteScript("arguments[0].CodeMirror.setValue(\"" + ExistingCSS + table.Rows[i]["CssValue"] + "\")", Driver.FindElement(By.ClassName("CodeMirror")));

        };

It adds the lines but next time when I run the same code, it overrides what was written in that code-mirror textarea.

Help? Thanks. :)

Answer 1

I fixed it by doing a small "hack" - I found the Textarea which had style.display = none. - I changed its value to Block: js.ExecuteScript("document.getElementById('CustomCssArea').style.display = 'block'"); -> so it was visible. - Then i simply sent CSS values to that textarea by using "element.SendKeys("CSS Values here...");