The flow of browsing the web and executing scripts in a web browser

Question

The flow of browsing the web and executing scripts in a web browser

I'm really struggling to grasp the logic behind this function I'm working on.

    public void PortalLogin(AutoResetEvent signal)
            {
                // Navigate to portal
                string portalUrl = "website_name";
                string portalEmail = "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="cca9a1ada5a08ca9a1ada5a0e2afa3a1">[email protected]</a>";
                string portalPassword = "password";
                Action action2 = () =>
                {
                    webBrowser2.Tag = signal;
                    webBrowser2.Navigate(portalUrl);
                    webBrowser2.DocumentCompleted -= WebBrowserDocumentCompleted;
                    webBrowser2.DocumentCompleted += WebBrowserDocumentCompleted;
                };
                webBrowser2.Invoke(action2);
                signal.WaitOne();

                // Login to O365 portal
                webBrowser2.Invoke(new Action(() =>
                {
                    HtmlElement head = webBrowser2.Document.GetElementsByTagName("head")[0];
                    HtmlElement testScript = webBrowser2.Document.CreateElement("script");
                    IHTMLScriptElement element = (IHTMLScriptElement)testScript.DomElement;
                    element.text = "function PortalLogin() { document.getElementById('userid').value = '" + portalEmail + "'; document.getElementById('password').value = '" + portalPassword + "';  document.getElementById('login').submit(); }";
                    head.AppendChild(testScript);
                    webBrowser2.Document.InvokeScript("PortalLogin");
                }));
            }

... more functions after this

As I debug, it appears that the

document.getElementById('login').submit();

part of the script is not being executed at the right moment. How can I ensure that nothing proceeds until the InvokeScript has been fully completed?

If there are any unnecessary lines of code or areas that can be tidied up, I would greatly appreciate any feedback on that too.

UPDATE: Below is the DocumentCompleted function.

private void WebBrowserDocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs Url)
        {
            ((AutoResetEvent)((WebBrowser)sender).Tag).Set();
        }

c#javascript forms browser webbrowser-control

Answer 1

Answer №1

Let me highlight a few key points:

To streamline your code, consider adding the DocumentCompleted event handler outside the PortalLogin function and reuse it whenever needed. Since you are using AutoResetEvent, which automatically resets to a non-signaled state after calling signal.WaitOne(), having just one permanent handler for DocumentCompleted should suffice.

Before invoking the InvokeScript method, make sure that document.getElementById('login') indeed returns a valid element with the submit method available. You could even split the login process into two distinct steps for better control.

            // Code block for setting up login function and executing it
            element.text = "function PortalLogin() { document.getElementById('userid').value = '" + portalEmail + "'; document.getElementById('password').value = '" + portalPassword + "';  }" +
                "function ExecuteLogin() { document.getElementById('login').submit(); }";
            head.AppendChild(testScript);
            webBrowser2.Document.InvokeScript("PortalLogin");
            // Verify the presence of 'login' element before proceeding
            webBrowser2.Document.InvokeScript("ExecuteLogin");

If the login is successful, another DocumentCompleted event would be triggered eventually.

I recommend refactoring this code using a single thread and implementing the await/async pattern. Transforming DocumentCompleted as a task with TaskCompletionSource (explained in this reference) can significantly enhance the readability and efficiency of your code.

Here's an example snippet showcasing how the implementation might look like with async/await. Replace instances of MessageBox.Show with your DOM manipulations for a smoother experience on the main UI thread.

// Code block demonstrating async/await pattern 
void Form1_Load(object sender, EventArgs e)
{
    var task = DoNavigationAsync();
    task.ContinueWith((t) =>
    {
        MessageBox.Show("Navigation done!");
    }, TaskScheduler.FromCurrentSynchronizationContext());
}

// Skeleton structure for TaskCompletionSource parameter
struct Void {};

async Task DoNavigationAsync()
{
    Void v;
    TaskCompletionSource<Void> tcs = null; 
    WebBrowserDocumentCompletedEventHandler documentComplete = null;

    documentComplete = new WebBrowserDocumentCompletedEventHandler((s, e) =>
    {
        // Omit additional DocumentCompleted events to ensure a smooth navigation flow
        this.WB.DocumentCompleted -= documentComplete;              
        tcs.SetResult(v); // Proceed from where awaited
    });

    // Navigate to www.bing.com
    tcs = new TaskCompletionSource<Void>();
    this.WB.DocumentCompleted += documentComplete;
    this.WB.Navigate("http://www.bing.com");
    await tcs.Task;
    MessageBox.Show(this.WB.Document.Url.ToString()); // Perform desired actions with WB.Document

    // Repeat similar process for other URLs like www.google.com and www.yahoo.com

    return;
}

Answer 2

Let me highlight a few key points:

To streamline your code, consider adding the DocumentCompleted event handler outside the PortalLogin function and reuse it whenever needed. Since you are using AutoResetEvent, which automatically resets to a non-signaled state after calling signal.WaitOne(), having just one permanent handler for DocumentCompleted should suffice.

Before invoking the InvokeScript method, make sure that document.getElementById('login') indeed returns a valid element with the submit method available. You could even split the login process into two distinct steps for better control.

            // Code block for setting up login function and executing it
            element.text = "function PortalLogin() { document.getElementById('userid').value = '" + portalEmail + "'; document.getElementById('password').value = '" + portalPassword + "';  }" +
                "function ExecuteLogin() { document.getElementById('login').submit(); }";
            head.AppendChild(testScript);
            webBrowser2.Document.InvokeScript("PortalLogin");
            // Verify the presence of 'login' element before proceeding
            webBrowser2.Document.InvokeScript("ExecuteLogin");

If the login is successful, another DocumentCompleted event would be triggered eventually.

I recommend refactoring this code using a single thread and implementing the await/async pattern. Transforming DocumentCompleted as a task with TaskCompletionSource (explained in this reference) can significantly enhance the readability and efficiency of your code.

Here's an example snippet showcasing how the implementation might look like with async/await. Replace instances of MessageBox.Show with your DOM manipulations for a smoother experience on the main UI thread.

// Code block demonstrating async/await pattern 
void Form1_Load(object sender, EventArgs e)
{
    var task = DoNavigationAsync();
    task.ContinueWith((t) =>
    {
        MessageBox.Show("Navigation done!");
    }, TaskScheduler.FromCurrentSynchronizationContext());
}

// Skeleton structure for TaskCompletionSource parameter
struct Void {};

async Task DoNavigationAsync()
{
    Void v;
    TaskCompletionSource<Void> tcs = null; 
    WebBrowserDocumentCompletedEventHandler documentComplete = null;

    documentComplete = new WebBrowserDocumentCompletedEventHandler((s, e) =>
    {
        // Omit additional DocumentCompleted events to ensure a smooth navigation flow
        this.WB.DocumentCompleted -= documentComplete;              
        tcs.SetResult(v); // Proceed from where awaited
    });

    // Navigate to www.bing.com
    tcs = new TaskCompletionSource<Void>();
    this.WB.DocumentCompleted += documentComplete;
    this.WB.Navigate("http://www.bing.com");
    await tcs.Task;
    MessageBox.Show(this.WB.Document.Url.ToString()); // Perform desired actions with WB.Document

    // Repeat similar process for other URLs like www.google.com and www.yahoo.com

    return;
}

The flow of browsing the web and executing scripts in a web browser

Answer №1

Similar questions

Transforming DOM elements into Objects

Having some trouble identifying the specific name of the item I require in C# using Newtonsoft JSON. It seems quite

Make sure that the webpage does not display any content until the stylesheet has been fully loaded by

What could be causing the strange output from my filtered Object.values() function?

Guide to selecting and clicking multiple elements with a specific class using jQuery

Is there a universal method to disregard opacity when utilizing jQuery's clone() function across different web browsers?

Identify whether the page is being accessed through the Samsung stock browser or as an independent web application

Display only the most recent AJAX results

Is there a method to globally import "typings" in Visual Code without having to make changes to every JS file?

transform array elements into an object

Angular Material (8) error code S2591: The variable 'require' is not defined in the current scope

Sticky positioning with varying column widths

Guide on creating and synchronizing an XML/JSON file that stores beat information (BPM) for audio using JavaScript

Tips for populating countryList data in Form.Select component within a React.js application

Enable Cursor Display in Readonly Input Fields

``Trouble with React Dropdown menu option selection"

"Troubleshooting a callback problem in jQuery involving JavaScript and AJAX

Unable to create a clickable button within a CSS3DObject using Three.js

"Pairing Angular's loader with RxJS combineLatest for seamless data

Unable to render page with scrapy and javascript using splash