1
00:00:00,500 --> 00:00:04,800
In this lecture, we're going to talk about file upload software, performing a file upload.

2
00:00:04,820 --> 00:00:09,920
Once again, the site, like whatever I have for the demo site, I don't really have a support for file

3
00:00:09,920 --> 00:00:10,610
uploading did.

4
00:00:10,910 --> 00:00:16,550
So I'm actually going to show you on different site, which actually has got the file upload functionality.

5
00:00:17,000 --> 00:00:21,400
So you can see that there is a site called Yuppy which actually has way.

6
00:00:21,410 --> 00:00:25,130
Do you can I mean, that just shows you how you can do an extra hour uploads and stuff.

7
00:00:25,460 --> 00:00:30,140
So if you just choose a file, you can specify a file to choose and you can see that the file upload

8
00:00:30,150 --> 00:00:33,260
just happens over here like Officer Geopark or something like that.

9
00:00:33,290 --> 00:00:36,200
This is pretty, pretty straightforward way of doing it.

10
00:00:36,440 --> 00:00:41,300
We can do exactly the same thing and see if that particular file upload is actually happening because

11
00:00:41,300 --> 00:00:47,120
it opens the file Josa Ravindra window and then it also opens the file and uploads it.

12
00:00:47,480 --> 00:00:52,020
So why can't we just try to do the exact same thing and see how it actually works.

13
00:00:52,070 --> 00:00:58,850
So for doing that I'm going to create once again a new file and I'm going to call this as file upload

14
00:01:00,320 --> 00:01:01,160
Dodgiest.

15
00:01:01,550 --> 00:01:06,100
And over here I'm going to type the exact same code that we always try to do.

16
00:01:06,110 --> 00:01:13,130
So I'm just going to probably just kind of copy the code until.

17
00:01:14,630 --> 00:01:22,070
Over here, and I'm just going to pace this probably this time, I'm just going to use Firefox just

18
00:01:22,070 --> 00:01:28,240
for a change and I'm going to call this as Firefox and Arrow method.

19
00:01:28,760 --> 00:01:33,680
And over here, I'm just going to go to the particular page and I'm going to see how the particular

20
00:01:34,220 --> 00:01:35,580
file upload is going to happen.

21
00:01:35,600 --> 00:01:39,370
So for doing that, I'm just going to do something like this.

22
00:01:39,380 --> 00:01:40,990
So this is going to be the exact same thing.

23
00:01:41,510 --> 00:01:43,190
Go to this particular file.

24
00:01:46,350 --> 00:01:51,450
So for doing that, I need to go to that particular page so the court is going to look something like

25
00:01:51,450 --> 00:01:56,150
this, so it's going to be the same thing that I will examples like which are applaud.

26
00:01:56,460 --> 00:01:59,100
I'm going to wait for the network will to be fully.

27
00:02:00,440 --> 00:02:06,810
Completed, and once it is there, I need to perform a file upload operation on that particular page.

28
00:02:06,830 --> 00:02:17,120
So if you go to that particular site, maybe I could just open the Chrome browser and I can just copy

29
00:02:17,120 --> 00:02:17,930
the site.

30
00:02:20,410 --> 00:02:21,580
Pasted over here.

31
00:02:22,530 --> 00:02:28,510
That's right, click inspect element, you can see that the the button is actually off type file over

32
00:02:28,510 --> 00:02:31,520
here, which means it's a file upload type or file type.

33
00:02:31,900 --> 00:02:38,320
So in these situations, we actually need to, first of all, identify the control, which is nothing

34
00:02:38,320 --> 00:02:39,880
but the file type.

35
00:02:40,030 --> 00:02:45,040
And then we need to call what is called as a method called a set input files method.

36
00:02:45,290 --> 00:02:49,080
If we call the particular method where we can specify the file names and stuff.

37
00:02:49,360 --> 00:02:53,630
So I'm going to probably right that code over here and then I can show you what it really mean.

38
00:02:54,010 --> 00:03:00,790
So if I just do enervate off the page dot, I wonder and if I bigger control so for doing that, I'm

39
00:03:00,790 --> 00:03:06,520
just going to use a dollar symbol so you can see that we have never, ever discussed about this $ symbol

40
00:03:06,520 --> 00:03:13,780
so far, because all this time we have been using just using the click operation or full operation or

41
00:03:13,870 --> 00:03:18,120
either by using the select operation or Select Options operation.

42
00:03:18,130 --> 00:03:24,640
So we just always try to identify a control repository file of a control directly to the operation that

43
00:03:24,640 --> 00:03:25,480
we're going to perform.

44
00:03:25,690 --> 00:03:30,700
But this time we're going to be identifying a control like a selector itself.

45
00:03:30,880 --> 00:03:33,450
That's why I'm going to be using a dollar operation.

46
00:03:34,180 --> 00:03:40,920
So you can see that within playwrite or even in the puppeteer, there is a concept called as selectors

47
00:03:40,930 --> 00:03:48,620
using the DOM operation, like how you do select in the chrome tool itself so you can use the daughters,

48
00:03:49,360 --> 00:03:53,680
our daughters or daughter, daughter, evol or evol or here.

49
00:03:53,710 --> 00:03:56,650
So these two are pretty much exactly the same as this one.

50
00:03:56,920 --> 00:04:00,450
So you can use those operation, which is pretty good.

51
00:04:00,460 --> 00:04:05,080
I mean, you can do the exact same operation that you can actually do on the browser, something like

52
00:04:05,080 --> 00:04:05,320
this.

53
00:04:05,320 --> 00:04:11,680
So if I just do a dollar here, you can see that this is the same data which I'm talking about, guys,

54
00:04:12,010 --> 00:04:21,040
so we can bring the particular dollar over here and then we can specify the input of probably the type.

55
00:04:21,610 --> 00:04:22,720
I guess it's file.

56
00:04:22,720 --> 00:04:29,650
If I'm not wrong, I can just specify that and oops over here and you can see that it just brings me

57
00:04:29,650 --> 00:04:31,120
up the particular control over here.

58
00:04:31,360 --> 00:04:38,180
So this is exactly the same identifier technology we can use, even within the playwright as well.

59
00:04:38,200 --> 00:04:39,580
This is really, really cool.

60
00:04:39,580 --> 00:04:46,000
I mean, whatever that we can do on the browsers, we can do on the playwright Aspell directly.

61
00:04:46,210 --> 00:04:50,200
And you can see that with Donna, the intelligence is even more better.

62
00:04:50,210 --> 00:04:55,720
It also bring up the intelligence of what type of control that you are about to select, like progress

63
00:04:55,720 --> 00:05:01,000
or picture parum, output options, Aadi, rubies and stuff.

64
00:05:01,000 --> 00:05:02,860
And the one which I'm going to be writing is input.

65
00:05:02,860 --> 00:05:07,270
So if I just type it, you can see that the intelligence is actually going to show you and then you

66
00:05:07,270 --> 00:05:12,370
can do whatever that you want to do so you can specify the file or something like that.

67
00:05:12,790 --> 00:05:15,910
So it will do it for you over here.

68
00:05:16,060 --> 00:05:21,670
And once you have this particular handle, like once you identified the control file, then you can

69
00:05:21,670 --> 00:05:24,430
also do something like handle DOT.

70
00:05:24,920 --> 00:05:28,210
You can select the file, which you are going to be sitting.

71
00:05:28,210 --> 00:05:34,930
So you can just do a set input file method where you can specify the part of the file where the particular

72
00:05:34,960 --> 00:05:36,480
office chargeback is sitting.

73
00:05:36,490 --> 00:05:41,580
I think it is sitting in my downloads folder, so I'm just going to copy paste that location over here.

74
00:05:41,770 --> 00:05:42,520
That's it.

75
00:05:42,850 --> 00:05:45,670
So once I do that, it is going to do it for me.

76
00:05:45,940 --> 00:05:50,880
So this is the two options that you didn't do during the first identify the control and then you do

77
00:05:50,890 --> 00:05:56,020
perform a set operation and you can do the set input file directly over here.

78
00:05:56,020 --> 00:06:01,840
But I just want to split it to two lines that it's more meaningful to see and more clear to understand.

79
00:06:02,890 --> 00:06:08,740
Then once that is done, I can just go over here and then I'll choose the file, upload Argyris.

80
00:06:08,740 --> 00:06:13,210
And if I hit the enter, I'm intentionally not closing the browser at the moment because I want you

81
00:06:13,210 --> 00:06:14,650
to see what I'm doing.

82
00:06:15,040 --> 00:06:19,840
You can see that it actually is doing the file for us so instantly.

83
00:06:20,530 --> 00:06:21,580
Just quite cool, right?

84
00:06:21,580 --> 00:06:23,290
I mean, you just did that for us.

85
00:06:23,740 --> 00:06:29,500
So it just uploaded a file over here and everything is now like automated fashion.

86
00:06:29,860 --> 00:06:35,590
So this is the way that you can actually upload a file in playwrite and you can play around with it.

87
00:06:36,310 --> 00:06:39,430
Medio NextRadio with our Kasparov's a distinct feature.
