1
00:00:00,120 --> 00:00:06,720
All right, in our last video, we saw how we could able to write a simple test using this particular

2
00:00:06,720 --> 00:00:11,730
code, and we also saw how we can take a screenshot and how we run the tests and all those stuff, which

3
00:00:11,730 --> 00:00:13,560
was pretty straightforward and pretty easier.

4
00:00:13,920 --> 00:00:19,780
But it's also very, very painful to identify a control every time and perform an action.

5
00:00:19,800 --> 00:00:24,200
And this is something very, very painful if we are going to work with a larger project.

6
00:00:24,750 --> 00:00:30,900
So for that reason, that is a very, very simple record and playback tools available for many automation

7
00:00:30,900 --> 00:00:38,040
testing tools which will help you or make you more comfortable to use those automation testing tools.

8
00:00:38,130 --> 00:00:44,320
And playwrite is one such tool which actually has got a recording and playback kind of tool as well.

9
00:00:44,370 --> 00:00:47,090
They don't call this recording and playback tool the player team.

10
00:00:47,100 --> 00:00:50,550
They called us Playwrite Kellye or command line interface.

11
00:00:51,020 --> 00:00:55,680
They don't really have that particular detail over here on this particular documentation.

12
00:00:55,920 --> 00:01:00,780
But you can just search for playwrite Seelie and hit the enter.

13
00:01:01,020 --> 00:01:05,070
You can see that they have something called a playwright Clay over here.

14
00:01:05,080 --> 00:01:12,120
So if you just click this guy and if you come all the way down, you can see that it has all the details

15
00:01:12,120 --> 00:01:13,170
of the particular playwright.

16
00:01:13,710 --> 00:01:18,840
This is one of the handy tools that we can use to get started with playwrite and get acquainted with

17
00:01:18,840 --> 00:01:22,920
playwrite and see how you can actually use a particular tool more effectively.

18
00:01:23,240 --> 00:01:30,540
Are you going to do is to do an installation of playwrite clay within your code and then you can start

19
00:01:30,540 --> 00:01:31,130
working with it.

20
00:01:31,380 --> 00:01:37,530
So I'm just going to copy the speaker command like NPM Install hyphen the playwright Seelie, and I'm

21
00:01:37,530 --> 00:01:39,240
just going to paste this guy over here.

22
00:01:39,960 --> 00:01:40,570
That's it.

23
00:01:40,590 --> 00:01:45,810
The installation is done and once installation is done, all you going to do is you can use this command

24
00:01:45,810 --> 00:01:51,140
like NPCs, playwright Clay Cordon of the website that you want to automate.

25
00:01:51,420 --> 00:01:52,330
That's it.

26
00:01:52,350 --> 00:01:57,340
Once you do that, you can really, really use this particular command to start using it.

27
00:01:57,360 --> 00:01:59,570
I mean, it's very, very simple and straightforward.

28
00:01:59,850 --> 00:02:03,090
So I'm probably going to come and copy this whole command.

29
00:02:03,090 --> 00:02:04,770
I'm not going to change anything at the moment.

30
00:02:04,770 --> 00:02:07,650
Like Playwrite Zeolite Corrigin off to org.

31
00:02:07,980 --> 00:02:14,590
Once I do that, you can see that it opens the Wikipedia dot org on a Chrome browser for us.

32
00:02:14,610 --> 00:02:15,450
Very cool.

33
00:02:15,900 --> 00:02:22,100
So once I just hover the mouse, it also shows all the locators for me like it's an input name is called

34
00:02:22,100 --> 00:02:29,010
The Search and this is a button normalized dot is called a search and this is a select with an idea

35
00:02:29,010 --> 00:02:30,050
of search language.

36
00:02:30,060 --> 00:02:35,270
So it tells you each and every thing for you over here, which is really, really cool.

37
00:02:35,490 --> 00:02:43,320
So maybe I'm just going to leave the language as English, which is cool, and then I'm going to search

38
00:02:43,320 --> 00:02:50,610
for maybe Apple and one and I'm going to choose this guy one from the dropdown.

39
00:02:50,880 --> 00:02:52,920
And you can see that it brings me up all the details.

40
00:02:53,190 --> 00:03:03,090
And once I just hover there, it also tells the text as and one and I can just click the architecture

41
00:03:03,240 --> 00:03:04,890
and just text me up over there.

42
00:03:05,160 --> 00:03:12,210
And then I can see all the operation that I'm doing is actually being recorded behind the scenes.

43
00:03:12,210 --> 00:03:15,690
So it automatically created the arrow function for us.

44
00:03:15,930 --> 00:03:18,390
And then it tells like commands.

45
00:03:18,390 --> 00:03:20,930
The browser is called Away to Chrome dot launch.

46
00:03:20,940 --> 00:03:22,110
It looks as follows.

47
00:03:22,600 --> 00:03:24,330
I'll take whatever that we wrote before.

48
00:03:24,330 --> 00:03:27,840
It's all coming in and then it's going to create a browser of the new context.

49
00:03:28,200 --> 00:03:32,400
And within the context, it is going to create like a page within the page.

50
00:03:32,400 --> 00:03:36,090
It is going to go to the Wikipedia site, click that search.

51
00:03:36,870 --> 00:03:41,250
It's going to fill the details over there, and then it's going to click the apple.

52
00:03:41,250 --> 00:03:45,310
And one, you can see that everything is just coming in and pretty cool.

53
00:03:45,630 --> 00:03:53,160
So now if I just go and close this browser over here, you can see that it just left the whole code

54
00:03:53,160 --> 00:03:55,710
for us like a recorded code for us.

55
00:03:55,710 --> 00:03:57,120
So we can just copy this.

56
00:03:57,120 --> 00:03:59,370
I mean, the player is still ACLC.

57
00:03:59,430 --> 00:04:00,720
It is a command line interface.

58
00:04:00,730 --> 00:04:05,640
It's not a playwright recorder UI or something like that where you can see everything you can export

59
00:04:05,640 --> 00:04:06,590
like and UI.

60
00:04:06,660 --> 00:04:12,840
Probably in a few months the team is going to release like a recording and playback tool, which is

61
00:04:12,840 --> 00:04:16,980
going to export the code on the different language binding that we saw before.

62
00:04:17,490 --> 00:04:19,070
But as of now, it's Seelie.

63
00:04:19,290 --> 00:04:28,230
And then I'm just going to say like Wiki darte, just like Wiki Dargis and I'm going to pass this cord.

64
00:04:28,230 --> 00:04:29,070
You can see that.

65
00:04:29,070 --> 00:04:35,490
It just brings me up all the code over here and this gives you more knowledge and information on how

66
00:04:35,490 --> 00:04:39,660
to play around with this tool as well, which is really, really cool.

67
00:04:39,870 --> 00:04:46,260
I mean, you can learn writing the best practice code like you need to do coding with the context and

68
00:04:46,260 --> 00:04:49,020
then you need to create a page within the page.

69
00:04:49,800 --> 00:04:52,170
You need to navigate something like that.

70
00:04:52,320 --> 00:04:59,820
And you can also learn how the selectors are being used and how you can enter a text on a text box.

71
00:04:59,990 --> 00:05:03,470
You can see that they use a full method to do that over here.

72
00:05:03,880 --> 00:05:05,480
There's something called a Stinky's.

73
00:05:05,480 --> 00:05:07,040
There is something called a Phil method.

74
00:05:07,370 --> 00:05:10,070
So there is a click method to perform a click operation.

75
00:05:10,070 --> 00:05:12,430
And you can see that the selectors are pretty straightforward.

76
00:05:12,440 --> 00:05:14,030
I mean, don't worry about the task.

77
00:05:14,030 --> 00:05:15,710
We're going to talk about that in our next section.

78
00:05:16,010 --> 00:05:22,490
But you can see that these things are going to help you to learn playwrite more and more easily.

79
00:05:23,330 --> 00:05:24,940
And everything comes in over here.

80
00:05:25,160 --> 00:05:30,310
And once the whole operation is done, they are closing one by one, like from the hierarchy.

81
00:05:30,320 --> 00:05:34,460
So the first they are going to close the page and then they're going to close the context and then they're

82
00:05:34,460 --> 00:05:35,520
going to close the browser.

83
00:05:35,900 --> 00:05:38,080
So in our last video, we didn't even close the page.

84
00:05:38,090 --> 00:05:40,190
Basically, we just closed to the browser.

85
00:05:40,520 --> 00:05:44,780
But they are closing like a best practice like page and then the context and then the browser.

86
00:05:45,140 --> 00:05:50,720
So to run this and see what's going to basically happen, I'm going to type Naude of Wicked RJ.

87
00:05:50,770 --> 00:05:55,280
So this is the way that you actually execute the code and once you hit the enter.

88
00:05:56,960 --> 00:06:02,420
You can see that the browser is being spun, it's typing up, anyone is going to click that boom, I

89
00:06:02,420 --> 00:06:08,180
guess it worked, but I'm not very sure if that really worked or not, because I don't see that it actually

90
00:06:08,330 --> 00:06:11,150
click the text architectures and things of that nature.

91
00:06:11,450 --> 00:06:19,700
But what we can do is we can try to take a screenshot or hear of Wade Page, dot a screenshot of the

92
00:06:19,700 --> 00:06:26,450
part where I'm going to say Wiki Dot, PMG, save this.

93
00:06:28,130 --> 00:06:28,670
Run that.

94
00:06:33,600 --> 00:06:39,190
Let it go and we can see whether it really clicked this architecture as well, so if I click that,

95
00:06:39,190 --> 00:06:41,140
you can see that it really clicked that architecture.

96
00:06:41,150 --> 00:06:45,370
So basically this code is actually working because it was so fast we couldn't really actually see if

97
00:06:45,370 --> 00:06:47,630
that really worked, which means it's working.

98
00:06:47,650 --> 00:06:48,010
Yeah.

99
00:06:48,220 --> 00:06:53,680
So you can see that the playwright Seelie is one of the handy tool for you to learn the playwright itself

100
00:06:54,040 --> 00:06:55,610
in a more and better manner.

101
00:06:55,870 --> 00:07:01,390
And these are some of the things which any automated testing tools possess, like a record and playback

102
00:07:01,390 --> 00:07:01,660
tool.

103
00:07:01,930 --> 00:07:05,050
And playwright actually has got one, which is really awesome.