How to use isCollapsed method in Playwright Internal
Best JavaScript code snippet using playwright-internal
index.js
Source:index.js 
1'use strict';2/* globals JSONSchemaView */3import {4 convertXOf,5 _if6} from './helpers.js';7/**8 * @class JSONSchemaView9 *10 * A pure JavaScript component for rendering JSON Schema in HTML.11*/12export default class JSONSchemaView {13 /**14 * @param {object} schema The JSON Schema object15 *16 * @param {number} [open=1] his number indicates up to how many levels the17 * rendered tree should expand. Set it to `0` to make the whole tree collapsed18 * or set it to `Infinity` to expand the tree deeply19 */20 constructor(schema, open) {21 this.schema = schema;22 this.open = open;23 this.isCollapsed = open <= 0;24 // Determine if a schema is an array25 this.isArray = this.schema && this.schema.type === 'array';26 // Determine if a schema is a primitive27 this.isPrimitive = this.schema &&28 !this.schema.properties &&29 !this.schema.items &&30 this.schema.type !== 'array' &&31 this.schema.type !== 'object';32 // populate isRequired property down to properties33 if (this.schema && Array.isArray(this.schema.required)) {34 this.schema.required.forEach(requiredProperty => {35 if (typeof this.schema.properties[requiredProperty] === 'object') {36 this.schema.properties[requiredProperty].isRequired = true;37 }38 });39 }40 }41 /*42 * Returns the template with populated properties.43 * This template does not have the children44 */45 template() {46 if (!this.schema) {47 return '';48 }49 return `50 <!-- Primitive -->51 ${_if(this.isPrimitive)`52 <div class="primitive">53 ${_if(this.schema.description || this.schema.title)`54 <a class="title"><span class="toggle-handle"></span>${this.schema.title || ''} </a>55 `}56 <span class="type">${this.schema.type}</span>57 ${_if(this.schema.isRequired)`58 <span class="required">*</span>59 `}60 ${_if(!this.isCollapsed && this.schema.format)`61 <span class="format">(${this.schema.format})</span>62 `}63 ${_if(!this.isCollapsed && this.schema.minimum)`64 <span class="range minimum">minimum:${this.schema.minimum}</span>65 `}66 ${_if(!this.isCollapsed && this.schema.exclusiveMinimum)`67 <span class="range exclusiveMinimum">(ex)minimum:${this.schema.exclusiveMinimum}</span>68 `}69 ${_if(!this.isCollapsed && this.schema.maximum)`70 <span class="range maximum">maximum:${this.schema.maximum}</span>71 `}72 ${_if(!this.isCollapsed && this.schema.exclusiveMaximum)`73 <span class="range exclusiveMaximum">(ex)maximum:${this.schema.exclusiveMaximum}</span>74 `}75 ${_if(!this.isCollapsed && this.schema.minLength)`76 <span class="range minLength">minLength:${this.schema.minLength}</span>77 `}78 ${_if(!this.isCollapsed && this.schema.maxLength)`79 <span class="range maxLength">maxLength:${this.schema.maxLength}</span>80 `}81 ${_if(this.schema.description && !this.isCollapsed)`82 <div class="inner description">${this.schema.description}</div>83 `}84 ${_if(!this.isCollapsed && this.schema.enum)`85 ${this.enum(this.schema, this.isCollapsed, this.open)}86 `}87 ${_if(this.schema.allOf && !this.isCollapsed)`${this.xOf(this.schema, 'allOf')}`}88 ${_if(this.schema.oneOf && !this.isCollapsed)`${this.xOf(this.schema, 'oneOf')}`}89 ${_if(this.schema.anyOf && !this.isCollapsed)`${this.xOf(this.schema, 'anyOf')}`}90 </div>91 `}92 <!-- Array -->93 ${_if(this.isArray)`94 <div class="array">95 <a class="title"><span class="toggle-handle"></span>${this.schema.title || ''}<span class="opening bracket">[</span>${_if(this.isCollapsed)`<span class="closing bracket">]</span>`}</a>96 ${_if(!this.isCollapsed && (this.schema.uniqueItems || this.schema.minItems || this.schema.maxItems))`97 <span>98 <span title="items range">(${this.schema.minItems || 0}..${this.schema.maxItems || 'â'})</span>99 ${_if(!this.isCollapsed && this.schema.uniqueItems)`<span title="unique" class="uniqueItems">â¦</span>`}100 </span>101 `}102 <div class="inner">103 ${_if(!this.isCollapsed && this.schema.description)`104 <div class="description">${this.schema.description}</div>105 `}106 </div>107 ${_if(!this.isCollapsed && this.schema.enum)`108 ${this.enum(this.schema, this.isCollapsed, this.open)}109 `}110 ${_if(this.schema.allOf && !this.isCollapsed)`${this.xOf(this.schema, 'allOf')}`}111 ${_if(this.schema.oneOf && !this.isCollapsed)`${this.xOf(this.schema, 'oneOf')}`}112 ${_if(this.schema.anyOf && !this.isCollapsed)`${this.xOf(this.schema, 'anyOf')}`}113 ${_if(!this.isCollapsed)`114 <span class="closing bracket">]</span>115 `}116 </div>117 `}118 <!-- Object -->119 ${_if(!this.isPrimitive && !this.isArray)`120 <div class="object">121 <a class="title"><span122 class="toggle-handle"></span>${this.schema.title || ''} <span123 class="opening brace">{</span>${_if(this.isCollapsed)`124 <span class="closing brace" ng-if="isCollapsed">}</span>125 `}</a>126 <div class="inner">127 ${_if(!this.isCollapsed && this.schema.description)`128 <div class="description">${this.schema.description}</div>129 `}130 <!-- children go here -->131 </div>132 ${_if(!this.isCollapsed && this.schema.enum)`133 ${this.enum(this.schema, this.isCollapsed, this.open)}134 `}135 ${_if(this.schema.allOf && !this.isCollapsed)`${this.xOf(this.schema, 'allOf')}`}136 ${_if(this.schema.oneOf && !this.isCollapsed)`${this.xOf(this.schema, 'oneOf')}`}137 ${_if(this.schema.anyOf && !this.isCollapsed)`${this.xOf(this.schema, 'anyOf')}`}138 ${_if(!this.isCollapsed)`139 <span class="closing brace">}</span>140 `}141 </div>142 `}143`.replace(/\s*\n/g, '\n').replace(/(\<\!\-\-).+/g, '').trim();144 }145 /*146 * Template for oneOf, anyOf and allOf147 */148 xOf(schema, type) {149 return `150 <div class="inner ${type}">151 <b>${convertXOf(type)}:</b>152 </div>153 `;154 }155 /*156 * Template for enums157 */158 enum(schema, isCollapsed, open) {159 return `160 ${_if(!isCollapsed && schema.enum)`161 <div class="inner enums">162 <b>Enum:</b>163 </div>164 `}165 `;166 }167 /*168 * Toggles the 'collapsed' state169 */170 toggle() {171 this.isCollapsed = !this.isCollapsed;172 this.render();173 }174 /*175 * Renders the element and returns it176 */177 render() {178 if (!this.element) {179 this.element = document.createElement('div');180 this.element.classList.add('json-schema-view');181 }182 if (this.isCollapsed) {183 this.element.classList.add('collapsed');184 } else {185 this.element.classList.remove('collapsed');186 }187 this.element.innerHTML = this.template();188 if (!this.schema) {189 return this.element;190 }191 if (!this.isCollapsed) {192 this.appendChildren(this.element);193 }194 // add event listener for toggling195 if (this.element.querySelector('a.title')) {196 this.element.querySelector('a.title').addEventListener('click', this.toggle.bind(this));197 }198 return this.element;199 }200 /*201 * Appends children to given element based on current schema202 */203 appendChildren(element) {204 const inner = element.querySelector('.inner');205 if (this.schema.enum) {206 const formatter = new JSONFormatter(this.schema.enum, this.open - 1);207 const formatterEl = formatter.render();208 formatterEl.classList.add('inner');209 element.querySelector('.enums.inner').appendChild(formatterEl);210 }211 if (this.isArray) {212 const view = new JSONSchemaView(this.schema.items, this.open - 1)213 inner.appendChild(view.render());214 }215 if (typeof this.schema.properties === 'object') {216 Object.keys(this.schema.properties).forEach(propertyName => {217 const property = this.schema.properties[propertyName];218 const tempDiv = document.createElement('div');;219 tempDiv.innerHTML = `<div class="property">220 <span class="name">${propertyName}:</span>221 </div>`;222 const view = new JSONSchemaView(property, this.open - 1);223 tempDiv.querySelector('.property').appendChild(view.render());224 inner.appendChild(tempDiv.querySelector('.property'));225 });226 }227 if (this.schema.allOf) { appendXOf.call(this, 'allOf'); }228 if (this.schema.oneOf) { appendXOf.call(this, 'oneOf'); }229 if (this.schema.anyOf) { appendXOf.call(this, 'anyOf'); }230 function appendXOf(type) {231 const innerAllOf = element.querySelector(`.inner.${type}`);232 this.schema[type].forEach(schema => {233 const inner = document.createElement('div');234 inner.classList.add('inner');235 const view = new JSONSchemaView(schema, this.open - 1);236 inner.appendChild(view.render());237 innerAllOf.appendChild(inner);238 });239 }240 }241}242// TODO: UMD...
collapseHorizontally.spec.js
Source:collapseHorizontally.spec.js
1describe('collapse directive', function() {2 var elementH, compileFnH, scope, $compile, $animate, $q;3 beforeEach(module('ui.bootstrap.collapse'));4 beforeEach(module('ngAnimateMock'));5 beforeEach(inject(function(_$rootScope_, _$compile_, _$animate_, _$q_) {6 scope = _$rootScope_;7 $compile = _$compile_;8 $animate = _$animate_;9 $q = _$q_;10 }));11 beforeEach(function() {12 elementH = angular.element(13 '<div uib-collapse="isCollapsed" '14 + 'expanding="expanding()" '15 + 'expanded="expanded()" '16 + 'collapsing="collapsing()" '17 + 'collapsed="collapsed()" '18 + 'horizontal>'19 + 'Some Content</div>');20 compileFnH = $compile(elementH);21 angular.element(document.body).append(elementH);22 });23 afterEach(function() {24 elementH.remove();25 });26 function initCallbacks() {27 scope.collapsing = jasmine.createSpy('scope.collapsing');28 scope.collapsed = jasmine.createSpy('scope.collapsed');29 scope.expanding = jasmine.createSpy('scope.expanding');30 scope.expanded = jasmine.createSpy('scope.expanded');31 }32 function assertCallbacks(expected) {33 ['collapsing', 'collapsed', 'expanding', 'expanded'].forEach(function(cbName) {34 if (expected[cbName]) {35 expect(scope[cbName]).toHaveBeenCalled();36 } else {37 expect(scope[cbName]).not.toHaveBeenCalled();38 }39 });40 }41 it('should be hidden on initialization if isCollapsed = true', function() {42 initCallbacks();43 scope.isCollapsed = true;44 compileFnH(scope);45 scope.$digest();46 expect(elementH.width()).toBe(0);47 assertCallbacks({ collapsed: true });48 });49 it('should not trigger any animation on initialization if isCollapsed = true', function() {50 var wrapperFn = function() {51 $animate.flush();52 };53 scope.isCollapsed = true;54 compileFnH(scope);55 scope.$digest();56 expect(wrapperFn).toThrowError(/No pending animations ready to be closed or flushed/);57 });58 it('should collapse if isCollapsed = true on subsequent use', function() {59 scope.isCollapsed = false;60 compileFnH(scope);61 scope.$digest();62 initCallbacks();63 scope.isCollapsed = true;64 scope.$digest();65 $animate.flush();66 expect(elementH.width()).toBe(0);67 assertCallbacks({ collapsing: true, collapsed: true });68 });69 it('should show after toggled from collapsed', function() {70 initCallbacks();71 scope.isCollapsed = true;72 compileFnH(scope);73 scope.$digest();74 expect(elementH.width()).toBe(0);75 assertCallbacks({ collapsed: true });76 scope.collapsed.calls.reset();77 scope.isCollapsed = false;78 scope.$digest();79 $animate.flush();80 expect(elementH.width()).not.toBe(0);81 assertCallbacks({ expanding: true, expanded: true });82 });83 it('should not trigger any animation on initialization if isCollapsed = false', function() {84 var wrapperFn = function() {85 $animate.flush();86 };87 scope.isCollapsed = false;88 compileFnH(scope);89 scope.$digest();90 expect(wrapperFn).toThrowError(/No pending animations ready to be closed or flushed/);91 });92 it('should expand if isCollapsed = false on subsequent use', function() {93 scope.isCollapsed = false;94 compileFnH(scope);95 scope.$digest();96 scope.isCollapsed = true;97 scope.$digest();98 $animate.flush();99 initCallbacks();100 scope.isCollapsed = false;101 scope.$digest();102 $animate.flush();103 expect(elementH.width()).not.toBe(0);104 assertCallbacks({ expanding: true, expanded: true });105 });106 it('should collapse if isCollapsed = true on subsequent uses', function() {107 scope.isCollapsed = false;108 compileFnH(scope);109 scope.$digest();110 scope.isCollapsed = true;111 scope.$digest();112 $animate.flush();113 scope.isCollapsed = false;114 scope.$digest();115 $animate.flush();116 initCallbacks();117 scope.isCollapsed = true;118 scope.$digest();119 $animate.flush();120 expect(elementH.width()).toBe(0);121 assertCallbacks({ collapsing: true, collapsed: true });122 });123 it('should change aria-expanded attribute', function() {124 scope.isCollapsed = false;125 compileFnH(scope);126 scope.$digest();127 expect(elementH.attr('aria-expanded')).toBe('true');128 scope.isCollapsed = true;129 scope.$digest();130 $animate.flush();131 expect(elementH.attr('aria-expanded')).toBe('false');132 });133 it('should change aria-hidden attribute', function() {134 scope.isCollapsed = false;135 compileFnH(scope);136 scope.$digest();137 expect(elementH.attr('aria-hidden')).toBe('false');138 scope.isCollapsed = true;139 scope.$digest();140 $animate.flush();141 expect(elementH.attr('aria-hidden')).toBe('true');142 });143 describe('expanding callback returning a promise', function() {144 var defer, collapsedWidth;145 beforeEach(function() {146 defer = $q.defer();147 scope.isCollapsed = true;148 scope.expanding = function() {149 return defer.promise;150 };151 compileFnH(scope);152 scope.$digest();153 collapsedWidth = elementH.width();154 // set flag to expand ...155 scope.isCollapsed = false;156 scope.$digest();157 // ... shouldn't expand yet ...158 expect(elementH.attr('aria-expanded')).not.toBe('true');159 expect(elementH.width()).toBe(collapsedWidth);160 });161 it('should wait for it to resolve before animating', function() {162 defer.resolve();163 // should now expand164 scope.$digest();165 $animate.flush();166 expect(elementH.attr('aria-expanded')).toBe('true');167 expect(elementH.width()).toBeGreaterThan(collapsedWidth);168 });169 it('should not animate if it rejects', function() {170 defer.reject();171 // should NOT expand172 scope.$digest();173 expect(elementH.attr('aria-expanded')).not.toBe('true');174 expect(elementH.width()).toBe(collapsedWidth);175 });176 });177 describe('collapsing callback returning a promise', function() {178 var defer, expandedWidth;179 beforeEach(function() {180 defer = $q.defer();181 scope.isCollapsed = false;182 scope.collapsing = function() {183 return defer.promise;184 };185 compileFnH(scope);186 scope.$digest();187 expandedWidth = elementH.width();188 // set flag to collapse ...189 scope.isCollapsed = true;190 scope.$digest();191 // ... but it shouldn't collapse yet ...192 expect(elementH.attr('aria-expanded')).not.toBe('false');193 expect(elementH.width()).toBe(expandedWidth);194 });195 it('should wait for it to resolve before animating', function() {196 defer.resolve();197 // should now collapse198 scope.$digest();199 $animate.flush();200 expect(elementH.attr('aria-expanded')).toBe('false');201 expect(elementH.width()).toBeLessThan(expandedWidth);202 });203 it('should not animate if it rejects', function() {204 defer.reject();205 // should NOT collapse206 scope.$digest();207 expect(elementH.attr('aria-expanded')).not.toBe('false');208 expect(elementH.width()).toBe(expandedWidth);209 });210 });...
SideMenuList.jsx
Source:SideMenuList.jsx
1import React from 'react'2import { Query } from 'react-apollo'3import { withRouter } from 'react-router-dom'4import ChatRoom from './ChatRoom'5import Constants from '../configs/constants'6import Person from './Person'7import Loader from './Loader'8import { GET_PERSONS, GET_PERSON_CLIENT } from '../graphql/queries/persons'9import { GET_CHATS_BY_PERSON } from '../graphql/queries/chat'10const SideMenuList = props => {11 props.setParams(props.match.params.id)12 switch (props.type) {13 default:14 case Constants.Menu.Conversations:15 return _renderConversationsMenu(props)16 case Constants.Menu.Persons:17 return _renderPersonsMenu(props)18 case Constants.Menu.Contexts:19 return _renderContextsMenu(props)20 case Constants.Menu.Search:21 return _renderSearchMenu(props)22 }23}24const _renderContextsMenu = props => (25 <div className={`side-menu-list ${props.isCollapsed ? 'iscollapsed' : ''}`}>26 <ChatRoom isCollapsed={props.isCollapsed} />27 <ChatRoom isCollapsed={props.isCollapsed} />28 <ChatRoom isCollapsed={props.isCollapsed} />29 <ChatRoom isCollapsed={props.isCollapsed} />30 <ChatRoom isCollapsed={props.isCollapsed} />31 <ChatRoom isCollapsed={props.isCollapsed} />32 <ChatRoom isCollapsed={props.isCollapsed} />33 <ChatRoom isCollapsed={props.isCollapsed} />34 <ChatRoom isCollapsed={props.isCollapsed} />35 <ChatRoom isCollapsed={props.isCollapsed} />36 <ChatRoom isCollapsed={props.isCollapsed} />37 <ChatRoom isCollapsed={props.isCollapsed} />38 <ChatRoom isCollapsed={props.isCollapsed} />39 <ChatRoom isCollapsed={props.isCollapsed} />40 <ChatRoom isCollapsed={props.isCollapsed} />41 <ChatRoom isCollapsed={props.isCollapsed} />42 <ChatRoom isCollapsed={props.isCollapsed} />43 <ChatRoom isCollapsed={props.isCollapsed} />44 <ChatRoom isCollapsed={props.isCollapsed} />45 <ChatRoom isCollapsed={props.isCollapsed} />46 <ChatRoom isCollapsed={props.isCollapsed} />47 <ChatRoom isCollapsed={props.isCollapsed} />48 <ChatRoom isCollapsed={props.isCollapsed} />49 <ChatRoom isCollapsed={props.isCollapsed} />50 <ChatRoom isCollapsed={props.isCollapsed} />51 <ChatRoom isCollapsed={props.isCollapsed} />52 <ChatRoom isCollapsed={props.isCollapsed} />53 <ChatRoom isCollapsed={props.isCollapsed} />54 <ChatRoom isCollapsed={props.isCollapsed} />55 <ChatRoom isCollapsed={props.isCollapsed} />56 <ChatRoom isCollapsed={props.isCollapsed} />57 <ChatRoom isCollapsed={props.isCollapsed} />58 <ChatRoom isCollapsed={props.isCollapsed} />59 <ChatRoom isCollapsed={props.isCollapsed} />60 <ChatRoom isCollapsed={props.isCollapsed} />61 <ChatRoom isCollapsed={props.isCollapsed} />62 <ChatRoom isCollapsed={props.isCollapsed} />63 <ChatRoom isCollapsed={props.isCollapsed} />64 <ChatRoom isCollapsed={props.isCollapsed} />65 <ChatRoom isCollapsed={props.isCollapsed} />66 <ChatRoom isCollapsed={props.isCollapsed} />67 <ChatRoom isCollapsed={props.isCollapsed} />68 <ChatRoom isCollapsed={props.isCollapsed} />69 <ChatRoom isCollapsed={props.isCollapsed} />70 </div>71)72const _renderPersonsMenu = props => (73 <div className={`side-menu-list ${props.isCollapsed ? 'iscollapsed' : ''}`}>74 <Query query={GET_PERSON_CLIENT}>75 {({ loading, error, data, client }) => {76 if (loading) return <Loader />;77 if (error) return <Loader />78 return (79 <Query query={GET_PERSONS} variables={{ id: data.user_logged.id }}>80 {({ loading, error, data }) => {81 if (loading) return <Loader />82 if (error) return `Error! ${error.message}`83 return data.allUsers.map(user => (84 <Person85 id={user.id}86 key={user.id}87 name={user.name}88 type={Constants.Person.MenuList}89 hideContent={props.isCollapsed}90 src={user.photo}91 size={40}92 alt={user.name}93 rooms={user.rooms}94 />95 ))96 }}97 </Query>98 )99 }}100 </Query>101 </div>102)103const _renderConversationsMenu = props => (104 <div className={`side-menu-list ${props.isCollapsed ? 'iscollapsed' : ''}`}>105 <Query query={GET_PERSON_CLIENT}>106 {({ loading, error, data, client }) => {107 if (loading) return <Loader />;108 if (error) return <Loader />109 return (110 <Query111 query={GET_CHATS_BY_PERSON}112 variables={{ id: data.user_logged.id }}113 >114 {({ loading, error, data }) => {115 if (loading) return <Loader />116 if (error) return `Error! ${error.message}`117 return data.allRooms.map(room => (118 <ChatRoom key={room.id} isCollapsed={props.isCollapsed} room={room} />119 ))120 }}121 </Query>122 )123 }}124 </Query>125 </div>126)127const _renderSearchMenu = props => (128 <div className={`side-menu-list ${props.isCollapsed ? 'iscollapsed' : ''}`}>129 <div className="search-input">130 <input placeholder="Search..." />131 </div>132 </div>133)...
collapse.spec.js
Source:collapse.spec.js
1describe('collapse directive', function () {2 var scope, $compile, $animate;3 var element;4 beforeEach(module('ui.bootstrap.collapse'));5 beforeEach(module('ngAnimateMock'));6 beforeEach(inject(function(_$rootScope_, _$compile_, _$animate_) {7 scope = _$rootScope_;8 $compile = _$compile_;9 $animate = _$animate_;10 }));11 beforeEach(function() {12 element = $compile('<div collapse="isCollapsed">Some Content</div>')(scope);13 angular.element(document.body).append(element);14 });15 afterEach(function() {16 element.remove();17 });18 it('should be hidden on initialization if isCollapsed = true without transition', function() {19 scope.isCollapsed = true;20 scope.$digest();21 $animate.triggerCallbacks();22 //No animation timeout here23 expect(element.height()).toBe(0);24 });25 it('should collapse if isCollapsed = true with animation on subsequent use', function() {26 scope.isCollapsed = false;27 scope.$digest();28 scope.isCollapsed = true;29 scope.$digest();30 $animate.triggerCallbacks();31 expect(element.height()).toBe(0);32 });33 it('should be shown on initialization if isCollapsed = false without transition', function() {34 scope.isCollapsed = false;35 scope.$digest();36 //No animation timeout here37 expect(element.height()).not.toBe(0);38 });39 it('should expand if isCollapsed = false with animation on subsequent use', function() {40 scope.isCollapsed = false;41 scope.$digest();42 scope.isCollapsed = true;43 scope.$digest();44 scope.isCollapsed = false;45 scope.$digest();46 $animate.triggerCallbacks();47 expect(element.height()).not.toBe(0);48 });49 it('should expand if isCollapsed = true with animation on subsequent uses', function() {50 scope.isCollapsed = false;51 scope.$digest();52 scope.isCollapsed = true;53 scope.$digest();54 scope.isCollapsed = false;55 scope.$digest();56 scope.isCollapsed = true;57 scope.$digest();58 $animate.triggerCallbacks();59 expect(element.height()).toBe(0);60 $animate.triggerCallbacks();61 expect(element.height()).toBe(0);62 });63 it('should change aria-expanded attribute', function() {64 scope.isCollapsed = false;65 scope.$digest();66 expect(element.attr('aria-expanded')).toBe('true');67 scope.isCollapsed = true;68 scope.$digest();69 expect(element.attr('aria-expanded')).toBe('false');70 });71 it('should change aria-hidden attribute', function() {72 scope.isCollapsed = false;73 scope.$digest();74 expect(element.attr('aria-hidden')).toBe('false');75 scope.isCollapsed = true;76 scope.$digest();77 expect(element.attr('aria-hidden')).toBe('true');78 });79 describe('dynamic content', function() {80 var element;81 beforeEach(function() {82 element = angular.element('<div collapse="isCollapsed"><p>Initial content</p><div ng-show="exp">Additional content</div></div>');83 $compile(element)(scope);84 angular.element(document.body).append(element);85 });86 afterEach(function() {87 element.remove();88 });89 it('should grow accordingly when content size inside collapse increases', function() {90 scope.exp = false;91 scope.isCollapsed = false;92 scope.$digest();93 $animate.triggerCallbacks();94 var collapseHeight = element.height();95 scope.exp = true;96 scope.$digest();97 expect(element.height()).toBeGreaterThan(collapseHeight);98 });99 it('should shrink accordingly when content size inside collapse decreases', function() {100 scope.exp = true;101 scope.isCollapsed = false;102 scope.$digest();103 $animate.triggerCallbacks();104 var collapseHeight = element.height();105 scope.exp = false;106 scope.$digest();107 expect(element.height()).toBeLessThan(collapseHeight);108 });109 });...
header.client.controller.tests.js
Source:header.client.controller.tests.js
1'use strict';2(function () {3 describe('HeaderController', function () {4 // Initialize global variables5 var scope,6 HeaderController,7 $state,8 Authentication;9 // Load the main application module10 beforeEach(module(ApplicationConfiguration.applicationModuleName));11 beforeEach(inject(function ($controller, $rootScope, _$state_, _Authentication_) {12 scope = $rootScope.$new();13 $state = _$state_;14 Authentication = _Authentication_;15 HeaderController = $controller('HeaderController as vm', {16 $scope: scope17 });18 }));19 it('should expose the authentication service', function () {20 expect(scope.vm.authentication).toBe(Authentication);21 });22 it('should default menu to collapsed', function () {23 expect(scope.vm.isCollapsed).toBeFalsy();24 });25 describe('when toggleCollapsibleMenu', function () {26 var defaultCollapse;27 beforeEach(function () {28 defaultCollapse = scope.vm.isCollapsed;29 scope.vm.isCollapsed = !scope.vm.isCollapsed;30 });31 it('should toggle isCollapsed to non default value', function () {32 expect(scope.vm.isCollapsed).not.toBe(defaultCollapse);33 });34 it('should then toggle isCollapsed back to default value', function () {35 scope.vm.isCollapsed = !scope.vm.isCollapsed;36 expect(scope.vm.isCollapsed).toBe(defaultCollapse);37 });38 });39 describe('when view state changes', function () {40 beforeEach(function () {41 scope.vm.isCollapsed = true;42 scope.$broadcast('$stateChangeSuccess');43 });44 it('should set isCollapsed to false', function () {45 expect(scope.vm.isCollapsed).toBeFalsy();46 });47 });48 });...
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.click('#orb-search-q');7 await page.type('#orb-search-q', 'coronavirus');8 await page.keyboard.press('Enter');9 await page.waitForSelector('text=Coronavirus: How are countries responding?');10 await page.click('text=Coronavirus: How are countries responding?');11 await page.waitForSelector('text=Coronavirus: How are countries responding?');12 await page.click('text=Coronavirus: How are countries responding?');13 await page.waitForSelector('text=Coronavirus: How are countries responding?');14 await page.click('text=Coronavirus: How are countries responding?');15 await page.waitForSelector('text=Coronavirus: How are countries responding?');16 await page.click('text=Coronavirus: How are countries responding?');17 await page.waitForSelector('text=Coronavirus: How are countries responding?');18 await page.click('text=Coronavirus: How are countries responding?');19 await page.waitForSelector('text=Coronavirus: How are countries responding?');20 await page.click('text=Coronavirus: How are countries responding?');21 await page.waitForSelector('text=Coronavirus: How are countries responding?');22 await page.click('text=Coronavirus: How are countries responding?');23 await page.waitForSelector('text=Coronavirus: How are countries responding?');24 await page.click('text=Coronavirus: How are countries responding?');25 await page.waitForSelector('text=Coronavirus: How are countries responding?');26 await page.click('text=Coronavirus: How are countries responding?');27 await page.waitForSelector('text=Coronavirus: How are countries responding?');28 await page.click('text=Coronavirus: How are countries responding?');29 await page.waitForSelector('text=Coronavirus: How are countries responding?');30 await page.click('text=Coronavirus: How are countries responding?');31 await page.waitForSelector('text=Coronavirus: How are countries responding?');32 await page.click('text=Coronavirus
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.click('text="Get started"');7 await page.click('text="API Docs"');8 await page.click('text="Page"');9 await page.click('text="isCollapsed"');10 await page.click('text="Parameters"');11 await page.click('text="Returns"');12 await page.click('text="Examples"');13 await page.click('text="Example 1"');14 await page.click('text="Example 2"');15 await page.click('text="Example 3"');16 await page.click('text="Example 4"');17 await page.click('text="Example 5"');18 await page.click('text="Example 6"');19 await page.click('text="Example 7"');20 await page.click('text="Example 8"');21 await page.click('text="Example 9"');22 await page.click('text="Example 10"');23 await page.click('text="Example 11"');24 await page.click('text="Example 12"');25 await page.click('text="Example 13"');26 await page.click('text="Example 14"');27 await page.click('text="Example 15"');28 await page.click('text="Example 16"');29 await page.click('text="Example 17"');30 await page.click('text="Example 18"');31 await page.click('text="Example 19"');32 await page.click('text="Example 20"');33 await page.click('text="Example 21"');34 await page.click('text="Example 22"');35 await page.click('text="Example 23"');36 await page.click('text="Example 24"');37 await page.click('text="Example 25"');38 await page.click('text="Example 26"');39 await page.click('text="Example 27"');40 await page.click('text="Example 28"');41 await page.click('text="Example 29"');42 await page.click('text="Example 30"');43 await page.click('text="Example 31"');
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch({ headless: false });4 const context = await browser.newContext();5 const page = await context.newPage();6 const input = await page.$('input[name="q"]');7 await input.focus();8 await page.keyboard.type('Hello World!');9 await page.keyboard.press('Backspace');10 await page.keyboard.press('ArrowLeft');11 const selection = await input.evaluateHandle((input) => {12 return {13 };14 });15 const isCollapsed = await selection.evaluate((selection) => {16 return (17 );18 });19 console.log(isCollapsed);20 await browser.close();21})();22const { chromium } = require('playwright');23(async () => {24 const browser = await chromium.launch({ headless: false });25 const context = await browser.newContext();26 const page = await context.newPage();27 const input = await page.$('input[name="q"]');28 await input.focus();29 await page.keyboard.type('Hello World!');30 await page.keyboard.press('Backspace');31 await page.keyboard.press('ArrowLeft');32 const selection = await input.evaluateHandle((input) => {33 return {34 };35 });36 const isCollapsed = await selection.evaluate((selection) => {37 return (38 );39 });40 console.log(isCollapsed);41 await browser.close();42})();43const { chromium } = require('playwright');44(async () => {45 const browser = await chromium.launch({ headless: false });46 const context = await browser.newContext();47 const page = await context.newPage();
Using AI Code Generation
1const playwright = require("playwright");2(async () => {3 for (const browserType of BROWSER) {4 const browser = await playwright[browserType].launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 await page.click("input[name='q']");8 await page.keyboard.type("Hello World!");9 console.log(await page.isCollapsed());10 await browser.close();11 }12})();
Using AI Code Generation
1const { isCollapsed } = require('playwright/lib/server/dom.js');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const locator = await page.locator('text=Locator');8 console.log(await isCollapsed(locator));9 await browser.close();10})();11Locator.isIntersectingViewport()12const { isIntersectingViewport } = require('playwright/lib/server/dom.js');13const { chromium } = require('playwright');14(async () => {15 const browser = await chromium.launch();16 const context = await browser.newContext();17 const page = await context.newPage();18 const locator = await page.locator('text=Locator');19 console.log(await isIntersectingViewport(locator));20 await browser.close();21})();22Locator.isVisible()23const { isVisible } = require('playwright/lib/server/dom.js');24const { chromium } = require('playwright');25(async () => {26 const browser = await chromium.launch();27 const context = await browser.newContext();28 const page = await context.newPage();29 const locator = await page.locator('text=Locator');30 console.log(await isVisible(locator));31 await browser.close();32})();33Locator.isEditable()
Using AI Code Generation
1const { isCollapsed } = require('playwright/lib/page');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const page = await browser.newPage();6 await page.click('input[name="q"]');7 await page.type('input[name="q"]', 'Hello World');8 const isCollapsed = await page.evaluate(() => {9 const selection = window.getSelection();10 return selection.isCollapsed;11 });12 console.log('isCollapsed: ', isCollapsed);13 await browser.close();14})();15const { isCollapsed } = require('playwright/lib/page');16const { chromium } = require('playwright');17(async () => {18 const browser = await chromium.launch();19 const page = await browser.newPage();20 await page.click('input[name="q"]');21 await page.type('input[name="q"]', 'Hello World');22 const isCollapsed = await page.evaluate(() => {23 const selection = window.getSelection();24 return selection.isCollapsed;25 });26 console.log('isCollapsed: ', isCollapsed);27 await browser.close();28})();29const { isCollapsed } = require('playwright/lib/page');30const { chromium } = require('playwright');31(async () => {32 const browser = await chromium.launch();33 const page = await browser.newPage();34 await page.click('input[name="q"]');35 await page.type('input[name="q"]', 'Hello World');36 const isCollapsed = await page.evaluate(() => {37 const selection = window.getSelection();38 return selection.isCollapsed;39 });40 console.log('isCollapsed: ', isCollapsed);41 await browser.close();42})();43const { isCollapsed } = require('playwright/lib/page');44const { chromium } = require('playwright');45(async () => {46 const browser = await chromium.launch();47 const page = await browser.newPage();48 await page.click('input[name="q"]');
Using AI Code Generation
1const { isCollapsed } = require('playwright/lib/internal/selection');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 await page.click('input[name="q"]');8 await page.type('input[name="q"]', 'Playwright');9 const selection = await page.evaluate(() => window.getSelection());10 await page.click('input[name="q"]');11 const newSelection = await page.evaluate(() => window.getSelection());12 await browser.close();13})();
Using AI Code Generation
1const { isCollapsed } = require('playwright/lib/server/dom.js');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const page = await browser.newPage();6 const element = await page.$('text=Get started');7 const isCollapsed = await page.evaluate((element) => element.isCollapsed, element);8 console.log(isCollapsed);9 await browser.close();10})();
Using AI Code Generation
1const { isCollapsed } = require('playwright/lib/webkit/webkit');2const { webkit } = require('playwright');3(async () => {4 const browser = await webkit.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 await page.type('input[name="q"]', 'Hello World');8 const selection = await page.evaluate(() => window.getSelection());9 console.log(isCollapsed(selection));10 await browser.close();11})();12await page.evaluate(() => {13 const selection = window.getSelection();14 return selection.getRangeAt(0).collapsed;15});
Using AI Code Generation
1const { isCollapsed } = require('playwright/lib/internal/selection');2(async () => {3 const browser = await webkit.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.type('input', 'Hello World!');7 const selection = await page.evaluate(() => {8 const input = document.querySelector('input');9 input.select();10 return window.getSelection();11 });12 await browser.close();13})();
Playwright tutorial
LambdaTest’s Playwright tutorial will give you a broader idea about the Playwright automation framework, its unique features, and use cases with examples to exceed your understanding of Playwright testing. This tutorial will give A to Z guidance, from installing the Playwright framework to some best practices and advanced concepts.
Chapters:
- What is Playwright : Playwright is comparatively new but has gained good popularity. Get to know some history of the Playwright with some interesting facts connected with it.
- How To Install Playwright : Learn in detail about what basic configuration and dependencies are required for installing Playwright and run a test. Get a step-by-step direction for installing the Playwright automation framework.
- Playwright Futuristic Features: Launched in 2020, Playwright gained huge popularity quickly because of some obliging features such as Playwright Test Generator and Inspector, Playwright Reporter, Playwright auto-waiting mechanism and etc. Read up on those features to master Playwright testing.
- What is Component Testing: Component testing in Playwright is a unique feature that allows a tester to test a single component of a web application without integrating them with other elements. Learn how to perform Component testing on the Playwright automation framework.
- Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
- Functions and Selectors in Playwright: Learn how to launch the Chromium browser with Playwright. Also, gain a better understanding of some important functions like “BrowserContext,” which allows you to run multiple browser sessions, and “newPage” which interacts with a page.
- Handling Alerts and Dropdowns in Playwright : Playwright interact with different types of alerts and pop-ups, such as simple, confirmation, and prompt, and different types of dropdowns, such as single selector and multi-selector get your hands-on with handling alerts and dropdown in Playright testing.
- Playwright vs Puppeteer: Get to know about the difference between two testing frameworks and how they are different than one another, which browsers they support, and what features they provide.
- Run Playwright Tests on LambdaTest: Playwright testing with LambdaTest leverages test performance to the utmost. You can run multiple Playwright tests in Parallel with the LammbdaTest test cloud. Get a step-by-step guide to run your Playwright test on the LambdaTest platform.
- Playwright Python Tutorial: Playwright automation framework support all major languages such as Python, JavaScript, TypeScript, .NET and etc. However, there are various advantages to Python end-to-end testing with Playwright because of its versatile utility. Get the hang of Playwright python testing with this chapter.
- Playwright End To End Testing Tutorial: Get your hands on with Playwright end-to-end testing and learn to use some exciting features such as TraceViewer, Debugging, Networking, Component testing, Visual testing, and many more.
- Playwright Video Tutorial: Watch the video tutorials on Playwright testing from experts and get a consecutive in-depth explanation of Playwright automation testing.
Run Playwright Internal automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
