atata icon indicating copy to clipboard operation
atata copied to clipboard

How to use the repo to connect with a running Chrome browser and upload files?

Open zydjohnHotmail opened this issue 4 years ago • 0 comments

Hello: I want to use the repo to connect with a running Chrome browser, then from the current page, find a file upload button and click the button and select one file from my local PC and upload it. I have the following C# to run Chrome browser first:

Process ChromeProcess = new() { StartInfo = new ProcessStartInfo { FileName = @"C:\Program Files\Google\Chrome\Application\chrome.exe", Arguments = $"https://www.bing.com/ --new-window --remote-debugging-port=9222 --user-data-dir=C:\ChromeData" } }; ChromeProcess.Start(); I have the following component definition:

using _ = TikTokPage;

[Url("https://www.tiktok.com/@userXXX?lang=en")]
public class TikTokPage : Page<_>
{
    public H1<_> Header { get; private set; }
    [FindByXPath("@href='https://www.tiktok.com/upload?lang=en'")]
    public Link<_> Upload { get; private set; }
    [FindByClass("tiktok-btn-pc", Visibility = Visibility.Any)]
    public Button<_> Post { get; private set; }
}

I can verify web page after I login to TikTok by hand, like the following: AtataContext.Configure() .UseChrome() .WithOptions(x => x.DebuggerAddress = $"127.0.0.1:9222") .Build(); Go.To<TikTokPage>() .PageTitle.Should.Equal(TikTok_Title); However, I don’t know how to click on the “Upload” button. My code: AtataContext.Configure() .UseChrome() .WithOptions(x => x.DebuggerAddress = $"127.0.0.1:{ChromePort}") .Build(); Go.To<TikTokPage>() .PageTitle.Should.Equal(TikTok_Title) .Upload.Click(); The above code didn’t work for .Upload.Click();

From DevTools in Google Chrome, I can see the “Upload” button is the following element:

<svg class="tiktok-rpdue5-StyledUploadIcon e18d3d943" width="1em" height="1em" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">

I can see the href is fixed, the other, like svg class is dynamic. I want to know how I can click on the “Upload” button inside TikTok home page? [FindByXPath("@href='https://www.tiktok.com/upload?lang=en'")] is not correct. How to find a SVG element below the "A" link?

From testing by hand, I can see that after I click on “Upload” button, and in the open file dialog, I can select a local video file, then there is a hidden button is shown. The hidden button has the value “Post”, then I can click on “Post” button to finally upload a video file to TikTok, my home page. Please advise on how to write the code for this. Thanks,

zydjohnHotmail avatar Jan 11 '22 19:01 zydjohnHotmail