DEV Community

Cover image for Upload file with Selenide
Dilpreet Johal
Dilpreet Johal

Posted on

4 2

Upload file with Selenide

In this post, we will take a look at how to upload file with Selenide. We will do that using 2 different ways -

  1. Upload file with visible input field
  2. Upload file with hidden input field

Upload file (visible input)

When the input field is visible and intractable, we can simply use the .uploadFile command to upload the file -

// upload file
$("#file-upload").uploadFile(new File("src/test/data/sample.png"));

Enter fullscreen mode Exit fullscreen mode

In the code above, we are selecting the element with input[type=file] and then doing an upload on that.


Upload file (hidden input)

When the input field is hidden and not intractable, it makes it difficult sometimes to upload file. In this case, we need to do some Javascript DOM manipulation to make the input field visible and intractable again -

// execute js code
executeJavaScript("document.getElementById(\"upfile_1\").classList.remove(\"file_input_hidden\")");

// upload file
$("#upfile_1").uploadFile(new File("src/test/data/sample.png"));
Enter fullscreen mode Exit fullscreen mode

In the code above, we are first executing Javascript code to remove the class that is making the input field hidden. Once the input field is visible, we are uploading the file using the standard way.


To learn more about how to upload file in Selenide, check out the video below –


📧 Subscribe to my mailing list to get access to more content like this as well as be part of amazing free giveaways.

👍 You can follow my content here as well -

...

I love coffees! And, if this post helped you out and you would like to support my work, you can do that by clicking on the button below and buying me a cup of coffee -

Buy me a coffee

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more

Top comments (0)

👋 Kindness is contagious

Engage with a sea of insights in this enlightening article, highly esteemed within the encouraging DEV Community. Programmers of every skill level are invited to participate and enrich our shared knowledge.

A simple "thank you" can uplift someone's spirits. Express your appreciation in the comments section!

On DEV, sharing knowledge smooths our journey and strengthens our community bonds. Found this useful? A brief thank you to the author can mean a lot.

Okay