How to use toHaveAttribute method in Playwright Internal

Best JavaScript code snippet using playwright-internal

ClusterGraph.test.js

Source:ClusterGraph.test.js Github

copy

Full Screen

...642 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}643 autoZoom={false}/​>);644 await waitForItemPositionStable(screen.getAllByLabelText('pod')[0], waitTimeout);645 hoverItem(screen.getAllByLabelText('pod')[0]);646 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');647 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');648 }, testTimeout);649 it('focused services and service links have a different appearance', async () => {650 const dataSet = {651 pods: [pod1, pod2],652 services: [service1, service2],653 ingresses: [],654 replicaSets: [],655 statefulSets: [],656 daemonSets: [],657 deployments: []658 };659 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}660 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}661 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}662 autoZoom={false}/​>);663 await waitForItemPositionStable(screen.getAllByLabelText('service')[0], waitTimeout);664 hoverItem(screen.getAllByLabelText('service')[0]);665 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item');666 expect(screen.getAllByLabelText('service')[1]).toHaveAttribute('class', 'item-faded');667 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link');668 expect(screen.getAllByLabelText('service link')[1]).toHaveAttribute('class', 'link-faded');669 }, testTimeout);670 it('focused ingresses and ingress links have a different appearance', async () => {671 const dataSet = {672 pods: [pod1, pod2],673 services: [service1, service2],674 ingresses: [ingress1, ingress2],675 replicaSets: [],676 statefulSets: [],677 daemonSets: [],678 deployments: []679 };680 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}681 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}682 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}683 autoZoom={false}/​>);684 await waitForItemPositionStable(screen.getAllByLabelText('ingress')[0], waitTimeout);685 hoverItem(screen.getAllByLabelText('ingress')[0]);686 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item');687 expect(screen.getAllByLabelText('ingress')[1]).toHaveAttribute('class', 'item-faded');688 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link');689 expect(screen.getAllByLabelText('ingress link')[1]).toHaveAttribute('class', 'link-faded');690 }, testTimeout);691 it('focused replicaSets and replicaSet links have a different appearance', async () => {692 const dataSet = {693 pods: [pod1, pod2],694 services: [],695 ingresses: [],696 replicaSets: [replicaSet1, replicaSet2],697 statefulSets: [],698 daemonSets: [],699 deployments: []700 };701 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}702 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}703 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}704 autoZoom={false}/​>);705 await waitForItemPositionStable(screen.getAllByLabelText('replicaset')[0], waitTimeout);706 hoverItem(screen.getAllByLabelText('replicaset')[0]);707 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');708 expect(screen.getAllByLabelText('replicaset')[1]).toHaveAttribute('class', 'item-faded');709 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link');710 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link-faded');711 }, testTimeout);712 it('focused statefulSets and statefulSet links have a different appearance', async () => {713 const dataSet = {714 pods: [pod1, pod2],715 services: [],716 ingresses: [],717 replicaSets: [],718 statefulSets: [statefulSet1, statefulSet2],719 daemonSets: [],720 deployments: []721 };722 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}723 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}724 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}725 autoZoom={false}/​>);726 await waitForItemPositionStable(screen.getAllByLabelText('statefulset')[0], waitTimeout);727 hoverItem(screen.getAllByLabelText('statefulset')[0]);728 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item');729 expect(screen.getAllByLabelText('statefulset')[1]).toHaveAttribute('class', 'item-faded');730 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link');731 expect(screen.getAllByLabelText('statefulset link')[1]).toHaveAttribute('class', 'link-faded');732 }, testTimeout);733 it('focused daemonSets and daemonSet links have a different appearance', async () => {734 const dataSet = {735 pods: [pod1, pod2],736 services: [],737 ingresses: [],738 replicaSets: [],739 statefulSets: [],740 daemonSets: [daemonSet1, daemonSet2],741 deployments: []742 };743 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}744 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}745 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}746 autoZoom={false}/​>);747 await waitForItemPositionStable(screen.getAllByLabelText('daemonset')[0], waitTimeout);748 hoverItem(screen.getAllByLabelText('daemonset')[0]);749 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item');750 expect(screen.getAllByLabelText('daemonset')[1]).toHaveAttribute('class', 'item-faded');751 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link');752 expect(screen.getAllByLabelText('daemonset link')[1]).toHaveAttribute('class', 'link-faded');753 }, testTimeout);754 it('focused deployments and deployment links have a different appearance', async () => {755 const dataSet = {756 pods: [pod1, pod2],757 services: [],758 ingresses: [],759 replicaSets: [replicaSet1, replicaSet2],760 statefulSets: [],761 daemonSets: [],762 deployments: [deployment1, deployment2]763 };764 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}765 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}766 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}767 autoZoom={false}/​>);768 await waitForItemPositionStable(screen.getAllByLabelText('deployment')[0], waitTimeout);769 hoverItem(screen.getAllByLabelText('deployment')[0]);770 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item');771 expect(screen.getAllByLabelText('deployment')[1]).toHaveAttribute('class', 'item-faded');772 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link');773 expect(screen.getAllByLabelText('deployment link')[1]).toHaveAttribute('class', 'link-faded');774 }, testTimeout);775 it('focusing a pod also focuses connected services and ingresses and replicaSets and statefulSets and ' +776 'daemonSets and deployments', async () => {777 const dataSet = {778 pods: [pod1, pod2, pod3, pod4],779 services: [service1_2, service3, service4],780 ingresses: [ingress12_3, ingress4],781 replicaSets: [replicaSet1_2, replicaSet3, replicaSet4],782 statefulSets: [statefulSet1_2, daemonSet3],783 daemonSets: [daemonSet1_2, daemonSet3],784 deployments: [deployment12_3, deployment4]785 };786 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}787 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}788 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}789 autoZoom={false}/​>);790 await waitForItemPositionStable(screen.getAllByLabelText('pod')[0], waitTimeout);791 hoverItem(screen.getAllByLabelText('pod')[0]);792 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');793 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');794 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');795 expect(screen.getAllByLabelText('pod')[3]).toHaveAttribute('class', 'item-faded');796 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item');797 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link');798 expect(screen.getAllByLabelText('service')[1]).toHaveAttribute('class', 'item-faded');799 expect(screen.getAllByLabelText('service link')[1]).toHaveAttribute('class', 'link-faded');800 expect(screen.getAllByLabelText('service')[2]).toHaveAttribute('class', 'item-faded');801 expect(screen.getAllByLabelText('service link')[2]).toHaveAttribute('class', 'link-faded');802 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item');803 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link');804 expect(screen.getAllByLabelText('ingress')[1]).toHaveAttribute('class', 'item-faded');805 expect(screen.getAllByLabelText('ingress link')[1]).toHaveAttribute('class', 'link-faded');806 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');807 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link');808 expect(screen.getAllByLabelText('replicaset')[1]).toHaveAttribute('class', 'item-faded');809 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link-faded');810 expect(screen.getAllByLabelText('replicaset')[2]).toHaveAttribute('class', 'item-faded');811 expect(screen.getAllByLabelText('replicaset link')[2]).toHaveAttribute('class', 'link-faded');812 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item');813 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link');814 expect(screen.getAllByLabelText('statefulset')[1]).toHaveAttribute('class', 'item-faded');815 expect(screen.getAllByLabelText('statefulset link')[1]).toHaveAttribute('class', 'link-faded');816 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item');817 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link');818 expect(screen.getAllByLabelText('daemonset')[1]).toHaveAttribute('class', 'item-faded');819 expect(screen.getAllByLabelText('daemonset link')[1]).toHaveAttribute('class', 'link-faded');820 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item');821 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link');822 expect(screen.getAllByLabelText('deployment')[1]).toHaveAttribute('class', 'item-faded');823 expect(screen.getAllByLabelText('deployment link')[1]).toHaveAttribute('class', 'link-faded');824 }, testTimeout);825 it('focusing a service also focuses its target pods and its ingress', async () => {826 const dataSet = {827 pods: [pod1, pod2, pod3],828 services: [service1_2, service3],829 ingresses: [ingress12, ingress3],830 replicaSets: [replicaSet1_2_3],831 statefulSets: [statefulSet1],832 daemonSets: [daemonSet1],833 deployments: [deployment123]834 };835 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}836 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}837 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}838 autoZoom={false}/​>);839 await waitForItemPositionStable(screen.getAllByLabelText('replicaset')[0], waitTimeout);840 hoverItem(screen.getAllByLabelText('service')[0]);841 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');842 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item');843 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');844 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item');845 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link');846 expect(screen.getAllByLabelText('service link')[1]).toHaveAttribute('class', 'link');847 expect(screen.getAllByLabelText('service')[1]).toHaveAttribute('class', 'item-faded');848 expect(screen.getAllByLabelText('service link')[2]).toHaveAttribute('class', 'link-faded');849 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item');850 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link');851 expect(screen.getAllByLabelText('ingress')[1]).toHaveAttribute('class', 'item-faded');852 expect(screen.getAllByLabelText('ingress link')[1]).toHaveAttribute('class', 'link-faded');853 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');854 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');855 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');856 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');857 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');858 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');859 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');860 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');861 }, testTimeout);862 it('focusing a service link also focuses its service and target pod', async () => {863 const dataSet = {864 pods: [pod1, pod2, pod3],865 services: [service1_2, service3],866 ingresses: [ingress12, ingress3],867 replicaSets: [replicaSet1_2],868 statefulSets: [statefulSet1],869 daemonSets: [daemonSet1],870 deployments: [deployment12]871 };872 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}873 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}874 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}875 autoZoom={false}/​>);876 await waitForItemPositionStable(screen.getAllByLabelText('service')[0], waitTimeout);877 hoverLink(screen.getAllByLabelText('service link')[0]);878 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');879 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');880 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');881 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item');882 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link');883 expect(screen.getAllByLabelText('service link')[1]).toHaveAttribute('class', 'link-faded');884 expect(screen.getAllByLabelText('service')[1]).toHaveAttribute('class', 'item-faded');885 expect(screen.getAllByLabelText('service link')[2]).toHaveAttribute('class', 'link-faded');886 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');887 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');888 expect(screen.getAllByLabelText('ingress')[1]).toHaveAttribute('class', 'item-faded');889 expect(screen.getAllByLabelText('ingress link')[1]).toHaveAttribute('class', 'link-faded');890 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');891 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');892 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link-faded');893 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');894 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');895 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');896 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');897 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');898 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');899 }, testTimeout);900 it('focusing a replicaSet also focuses its target pods and its deployment', async () => {901 const dataSet = {902 pods: [pod1, pod2, pod3],903 services: [service1_2_3],904 ingresses: [ingress123],905 replicaSets: [replicaSet1_2, replicaSet3],906 statefulSets: [statefulSet1],907 daemonSets: [daemonSet1],908 deployments: [deployment12, deployment3]909 };910 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}911 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}912 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}913 autoZoom={false}/​>);914 await waitForItemPositionStable(screen.getAllByLabelText('replicaset')[0], waitTimeout);915 hoverItem(screen.getAllByLabelText('replicaset')[0]);916 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');917 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item');918 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');919 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');920 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');921 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');922 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');923 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');924 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link');925 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link');926 expect(screen.getAllByLabelText('replicaset')[1]).toHaveAttribute('class', 'item-faded');927 expect(screen.getAllByLabelText('replicaset link')[2]).toHaveAttribute('class', 'link-faded');928 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');929 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');930 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');931 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');932 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item');933 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link');934 expect(screen.getAllByLabelText('deployment')[1]).toHaveAttribute('class', 'item-faded');935 expect(screen.getAllByLabelText('deployment link')[1]).toHaveAttribute('class', 'link-faded');936 }, testTimeout);937 it('focusing a replicaSet link also focuses its replicaSet and target pod', async () => {938 const dataSet = {939 pods: [pod1, pod2, pod3],940 services: [service1_2_3],941 ingresses: [ingress123],942 replicaSets: [replicaSet1_2, replicaSet3],943 statefulSets: [statefulSet1],944 daemonSets: [daemonSet1],945 deployments: [deployment12, deployment3]946 };947 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}948 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}949 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}950 autoZoom={false}/​>);951 await waitForItemPositionStable(screen.getAllByLabelText('replicaset')[0], waitTimeout);952 hoverLink(screen.getAllByLabelText('replicaset link')[0]);953 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');954 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');955 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');956 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');957 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');958 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');959 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');960 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');961 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link');962 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link-faded');963 expect(screen.getAllByLabelText('replicaset')[1]).toHaveAttribute('class', 'item-faded');964 expect(screen.getAllByLabelText('replicaset link')[2]).toHaveAttribute('class', 'link-faded');965 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');966 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');967 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');968 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');969 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');970 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');971 expect(screen.getAllByLabelText('deployment')[1]).toHaveAttribute('class', 'item-faded');972 expect(screen.getAllByLabelText('deployment link')[1]).toHaveAttribute('class', 'link-faded');973 }, testTimeout);974 it('focusing a statefulSet also focuses its target pods', async () => {975 const dataSet = {976 pods: [pod1, pod2, pod3],977 services: [service1_2_3],978 ingresses: [ingress123],979 replicaSets: [replicaSet1],980 statefulSets: [statefulSet1_2, statefulSet3],981 daemonSets: [daemonSet1],982 deployments: [deployment1]983 };984 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}985 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}986 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}987 autoZoom={false}/​>);988 await waitForItemPositionStable(screen.getAllByLabelText('statefulset')[0], waitTimeout);989 hoverItem(screen.getAllByLabelText('statefulset')[0]);990 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');991 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item');992 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');993 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');994 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');995 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');996 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');997 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');998 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');999 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item');1000 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link');1001 expect(screen.getAllByLabelText('statefulset link')[1]).toHaveAttribute('class', 'link');1002 expect(screen.getAllByLabelText('statefulset')[1]).toHaveAttribute('class', 'item-faded');1003 expect(screen.getAllByLabelText('statefulset link')[2]).toHaveAttribute('class', 'link-faded');1004 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');1005 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');1006 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');1007 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');1008 }, testTimeout);1009 it('focusing a statefulSet link also focuses its statefulSet and target pod', async () => {1010 const dataSet = {1011 pods: [pod1, pod2, pod3],1012 services: [service1_2_3],1013 ingresses: [ingress123],1014 replicaSets: [replicaSet1],1015 statefulSets: [statefulSet1_2, statefulSet3],1016 daemonSets: [daemonSet1],1017 deployments: [deployment1]1018 };1019 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1020 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1021 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}1022 autoZoom={false}/​>);1023 await waitForItemPositionStable(screen.getAllByLabelText('statefulset')[0], waitTimeout);1024 hoverLink(screen.getAllByLabelText('statefulset link')[0]);1025 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');1026 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');1027 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');1028 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');1029 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');1030 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');1031 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');1032 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');1033 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');1034 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item');1035 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link');1036 expect(screen.getAllByLabelText('statefulset link')[1]).toHaveAttribute('class', 'link-faded');1037 expect(screen.getAllByLabelText('statefulset')[1]).toHaveAttribute('class', 'item-faded');1038 expect(screen.getAllByLabelText('statefulset link')[2]).toHaveAttribute('class', 'link-faded');1039 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');1040 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');1041 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');1042 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');1043 }, testTimeout);1044 it('focusing a daemonSet also focuses its target pods', async () => {1045 const dataSet = {1046 pods: [pod1, pod2, pod3],1047 services: [service1_2_3],1048 ingresses: [ingress123],1049 replicaSets: [replicaSet1],1050 statefulSets: [statefulSet1],1051 daemonSets: [daemonSet1_2, daemonSet3],1052 deployments: [deployment1]1053 };1054 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1055 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1056 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}1057 autoZoom={false}/​>);1058 await waitForItemPositionStable(screen.getAllByLabelText('daemonset')[0], waitTimeout);1059 hoverItem(screen.getAllByLabelText('daemonset')[0]);1060 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');1061 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item');1062 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');1063 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');1064 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');1065 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');1066 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');1067 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');1068 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');1069 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');1070 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');1071 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item');1072 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link');1073 expect(screen.getAllByLabelText('daemonset link')[1]).toHaveAttribute('class', 'link');1074 expect(screen.getAllByLabelText('daemonset')[1]).toHaveAttribute('class', 'item-faded');1075 expect(screen.getAllByLabelText('daemonset link')[2]).toHaveAttribute('class', 'link-faded');1076 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');1077 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');1078 }, testTimeout);1079 it('focusing a daemonSet link also focuses its statefulSet and target pod', async () => {1080 const dataSet = {1081 pods: [pod1, pod2, pod3],1082 services: [service1_2_3],1083 ingresses: [ingress123],1084 replicaSets: [replicaSet1],1085 statefulSets: [statefulSet1],1086 daemonSets: [daemonSet1_2, daemonSet3],1087 deployments: [deployment1]1088 };1089 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1090 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1091 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}1092 autoZoom={false}/​>);1093 await waitForItemPositionStable(screen.getAllByLabelText('daemonset')[0], waitTimeout);1094 hoverLink(screen.getAllByLabelText('daemonset link')[0]);1095 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');1096 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');1097 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');1098 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');1099 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');1100 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');1101 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');1102 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');1103 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');1104 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');1105 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');1106 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item');1107 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link');1108 expect(screen.getAllByLabelText('daemonset link')[1]).toHaveAttribute('class', 'link-faded');1109 expect(screen.getAllByLabelText('daemonset')[1]).toHaveAttribute('class', 'item-faded');1110 expect(screen.getAllByLabelText('daemonset link')[2]).toHaveAttribute('class', 'link-faded');1111 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');1112 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');1113 }, testTimeout);1114 it('focusing a deployment also focuses its target replicaSets and their target pods', async () => {1115 const dataSet = {1116 pods: [pod1, pod2, pod3, pod4],1117 services: [service1_2_3_4],1118 ingresses: [ingress123],1119 replicaSets: [replicaSet1_2, replicaSet3, replicaSet4],1120 statefulSets: [statefulSet1],1121 daemonSets: [daemonSet1],1122 deployments: [deployment12_3, deployment4]1123 };1124 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1125 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1126 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}1127 autoZoom={false}/​>);1128 await waitForItemPositionStable(screen.getAllByLabelText('deployment')[0], waitTimeout);1129 hoverItem(screen.getAllByLabelText('deployment')[0]);1130 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');1131 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item');1132 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item');1133 expect(screen.getAllByLabelText('pod')[3]).toHaveAttribute('class', 'item-faded');1134 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');1135 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');1136 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');1137 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');1138 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');1139 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link');1140 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link');1141 expect(screen.getAllByLabelText('replicaset')[1]).toHaveAttribute('class', 'item');1142 expect(screen.getAllByLabelText('replicaset link')[2]).toHaveAttribute('class', 'link');1143 expect(screen.getAllByLabelText('replicaset')[2]).toHaveAttribute('class', 'item-faded');1144 expect(screen.getAllByLabelText('replicaset link')[3]).toHaveAttribute('class', 'link-faded');1145 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');1146 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');1147 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');1148 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');1149 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item');1150 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link');1151 expect(screen.getAllByLabelText('deployment link')[1]).toHaveAttribute('class', 'link');1152 expect(screen.getAllByLabelText('deployment')[1]).toHaveAttribute('class', 'item-faded');1153 expect(screen.getAllByLabelText('deployment link')[2]).toHaveAttribute('class', 'link-faded');1154 }, testTimeout);1155 it('focusing a deployment link also focuses its deployment and target replicaSet', async () => {1156 const dataSet = {1157 pods: [pod1, pod2, pod3],1158 services: [service1_2_3],1159 ingresses: [ingress123],1160 replicaSets: [replicaSet1, replicaSet2, replicaSet3],1161 statefulSets: [statefulSet1],1162 daemonSets: [daemonSet1],1163 deployments: [deployment1_2, deployment3]1164 };1165 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1166 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1167 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}1168 autoZoom={false}/​>);1169 await waitForItemPositionStable(screen.getAllByLabelText('deployment')[0], waitTimeout);1170 hoverLink(screen.getAllByLabelText('deployment link')[0]);1171 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item-faded');1172 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');1173 expect(screen.getAllByLabelText('pod')[2]).toHaveAttribute('class', 'item-faded');1174 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item-faded');1175 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link-faded');1176 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item-faded');1177 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link-faded');1178 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');1179 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');1180 expect(screen.getAllByLabelText('replicaset')[1]).toHaveAttribute('class', 'item-faded');1181 expect(screen.getAllByLabelText('replicaset link')[1]).toHaveAttribute('class', 'link-faded');1182 expect(screen.getAllByLabelText('replicaset')[2]).toHaveAttribute('class', 'item-faded');1183 expect(screen.getAllByLabelText('replicaset link')[2]).toHaveAttribute('class', 'link-faded');1184 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item-faded');1185 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link-faded');1186 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item-faded');1187 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link-faded');1188 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item');1189 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link');1190 expect(screen.getAllByLabelText('deployment link')[1]).toHaveAttribute('class', 'link-faded');1191 expect(screen.getAllByLabelText('deployment')[1]).toHaveAttribute('class', 'item-faded');1192 expect(screen.getAllByLabelText('deployment link')[2]).toHaveAttribute('class', 'link-faded');1193 }, testTimeout);1194 it('unfocusing an element should remove all fades', async () => {1195 const dataSet = {1196 pods: [pod1],1197 services: [service1],1198 ingresses: [ingress1],1199 replicaSets: [replicaSet1],1200 statefulSets: [statefulSet1],1201 daemonSets: [daemonSet1],1202 deployments: [deployment1]1203 };1204 render(<ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1205 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1206 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet}1207 autoZoom={false}/​>);1208 await waitForItemPositionStable(screen.getAllByLabelText('service')[0], waitTimeout);1209 hoverItem(screen.getAllByLabelText('pod')[0]);1210 hoverAway();1211 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');1212 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item');1213 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link');1214 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item');1215 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link');1216 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item');1217 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link');1218 expect(screen.getAllByLabelText('statefulset')[0]).toHaveAttribute('class', 'item');1219 expect(screen.getAllByLabelText('statefulset link')[0]).toHaveAttribute('class', 'link');1220 expect(screen.getAllByLabelText('daemonset')[0]).toHaveAttribute('class', 'item');1221 expect(screen.getAllByLabelText('daemonset link')[0]).toHaveAttribute('class', 'link');1222 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item');1223 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link');1224 }, testTimeout);1225 it('focused element should stay focused after component update', async () => {1226 const dataSet1 = {1227 pods: [pod1, pod2],1228 services: [service1],1229 ingresses: [ingress1],1230 replicaSets: [replicaSet1],1231 statefulSets: [],1232 daemonSets: [],1233 deployments: [deployment1]1234 };1235 const dataSet2 = {1236 pods: [pod1, pod2],1237 services: [service1, service2],1238 ingresses: [ingress1_2],1239 replicaSets: [replicaSet1],1240 statefulSets: [],1241 daemonSets: [],1242 deployments: [deployment1]1243 };1244 const { rerender } = render(1245 <ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1246 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1247 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet1}1248 autoZoom={false}/​>1249 );1250 await waitForItemPositionStable(screen.getAllByLabelText('service')[0], waitTimeout);1251 hoverItem(screen.getAllByLabelText('service')[0]);1252 rerender(1253 <ClusterGraph onPodFocus={noOpHandler} onServiceFocus={noOpHandler} onIngressFocus={noOpHandler}1254 onReplicaSetFocus={noOpHandler} onStatefulSetFocus={noOpHandler}1255 onDaemonSetFocus={noOpHandler} onDeploymentFocus={noOpHandler} dataSet={dataSet2}1256 autoZoom={false}/​>1257 );1258 expect(screen.getAllByLabelText('pod')[0]).toHaveAttribute('class', 'item');1259 expect(screen.getAllByLabelText('pod')[1]).toHaveAttribute('class', 'item-faded');1260 expect(screen.getAllByLabelText('service')[0]).toHaveAttribute('class', 'item');1261 expect(screen.getAllByLabelText('service link')[0]).toHaveAttribute('class', 'link');1262 expect(screen.getAllByLabelText('service')[1]).toHaveAttribute('class', 'item-faded');1263 expect(screen.getAllByLabelText('service link')[1]).toHaveAttribute('class', 'link-faded');1264 expect(screen.getAllByLabelText('ingress')[0]).toHaveAttribute('class', 'item');1265 expect(screen.getAllByLabelText('ingress link')[0]).toHaveAttribute('class', 'link');1266 expect(screen.getAllByLabelText('replicaset')[0]).toHaveAttribute('class', 'item-faded');1267 expect(screen.getAllByLabelText('replicaset link')[0]).toHaveAttribute('class', 'link-faded');1268 expect(screen.getAllByLabelText('deployment')[0]).toHaveAttribute('class', 'item-faded');1269 expect(screen.getAllByLabelText('deployment link')[0]).toHaveAttribute('class', 'link-faded');1270 }, testTimeout);1271 it('drag and dropped services do not move anymore', async () => {1272 const dataSet1 = {1273 pods: [pod1, pod2],1274 services: [service1, service2],1275 ingresses: [],1276 replicaSets: [],1277 statefulSets: [],1278 daemonSets: [],1279 deployments: []1280 };1281 const dataSet2 = {1282 pods: [pod1, pod2, pod3],1283 services: [service1, service2, service3],...

Full Screen

Full Screen

Header.js

Source:Header.js Github

copy

Full Screen

...64 expect(header.ariaRole).toBe('presentation');65 });66 67 it("should have presentation role on header el", function() {68 expect(header).toHaveAttribute('role', 'presentation');69 });70 71 it("should have presentation role on titleCmp el", function() {72 expect(header.titleCmp).toHaveAttribute('role', 'presentation');73 });74 75 it("should have presentation role on titleCmp textEl", function() {76 expect(header.titleCmp.textEl).toHaveAttribute('role', 'presentation');77 });78 79 it("should have FocusableContainer disabled", function() {80 expect(header.enableFocusableContainer).toBe(false);81 });82 83 describe("after adding tools", function() {84 beforeEach(function() {85 header.addTool({ type: 'expand' });86 });87 88 it("should change ariaRole to toolbar", function() {89 expect(header.ariaRole).toBe('toolbar');90 });91 92 it("should change header el role to toolbar", function() {93 expect(header).toHaveAttribute('role', 'toolbar');94 });95 96 it("should not change titleCmp el role", function() {97 expect(header.titleCmp).toHaveAttribute('role', 'presentation');98 });99 100 it("should not change titleCmp textEl role", function() {101 expect(header.titleCmp.textEl).toHaveAttribute('role', 'presentation');102 });103 104 it("should enable FocusableContainer", function() {105 expect(header.enableFocusableContainer).toBe(true);106 });107 });108 });109 110 describe("accordion header", function() {111 beforeEach(function() {112 makeHeader({ isAccordionHeader: true });113 });114 115 it("should have presentation ariaRole", function() {116 expect(header.ariaRole).toBe('presentation');117 });118 119 it("should have presentation role on header el", function() {120 expect(header).toHaveAttribute('role', 'presentation');121 });122 123 it("should have tab role on titleCmp el", function() {124 expect(header.titleCmp).toHaveAttribute('role', 'tab');125 });126 127 it("should have no role on titleCmp textEl", function() {128 expect(header.titleCmp.textEl).not.toHaveAttribute('role');129 });130 131 it("should have FocusableContainer disabled", function() {132 expect(header.enableFocusableContainer).toBe(false);133 });134 135 describe("after adding tools", function() {136 beforeEach(function() {137 header.addTool({ type: 'pin' });138 });139 140 it("should not change ariaRole", function() {141 expect(header.ariaRole).toBe('presentation');142 });143 144 it("should not change header el role", function() {145 expect(header).toHaveAttribute('role', 'presentation');146 });147 148 it("should not change titleCmp el role", function() {149 expect(header.titleCmp).toHaveAttribute('role', 'tab');150 });151 152 it("should not change titleCmp textEl role", function() {153 expect(header.titleCmp.textEl).not.toHaveAttribute('role');154 });155 156 it("should not enable FocusableContainer", function() {157 expect(header.enableFocusableContainer).toBe(false);158 });159 });160 });161 });162 163 describe("with tools", function() {164 describe("ordinary header", function() {165 describe("with focusable tool(s)", function() {166 beforeEach(function() {167 makeHeader({168 tools: [{169 type: 'collapse'170 }]171 });172 });173 174 it("should have toolbar ariaRole", function() {175 expect(header.ariaRole).toBe('toolbar');176 });177 178 it("should have toolbar role on header el", function() {179 expect(header).toHaveAttribute('role', 'toolbar');180 });181 182 it("should have presentation role on titleCmp", function() {183 expect(header.titleCmp).toHaveAttribute('role', 'presentation');184 });185 186 it("should have presentation role on titleCmp textEl", function() {187 expect(header.titleCmp.textEl).toHaveAttribute('role', 'presentation');188 });189 190 it("should have FocusableContainer enabled", function() {191 expect(header.enableFocusableContainer).toBe(true);192 });193 });194 195 describe("with non-focusable tools", function() {196 beforeEach(function() {197 makeHeader({198 tools: [{199 type: 'close',200 focusable: false,201 tabIndex: null202 }]203 });204 });205 206 it("should have presentation role", function() {207 expect(header.ariaRole).toBe('presentation');208 });209 210 it("should have presentation role on header el", function() {211 expect(header).toHaveAttribute('role', 'presentation');212 });213 214 it("should have presentation role on titleCmp", function() {215 expect(header.titleCmp).toHaveAttribute('role', 'presentation');216 });217 218 it("should have presentation role on titleCmp textEl", function() {219 expect(header.titleCmp.textEl).toHaveAttribute('role', 'presentation');220 });221 222 it("should have FocusableContainer disabled", function() {223 expect(header.enableFocusableContainer).toBe(false);224 });225 });226 });227 228 describe("accordion header", function() {229 beforeEach(function() {230 makeHeader({231 isAccordionHeader: true,232 tools: [{233 type: 'collapse'234 }]235 });236 });237 238 it("should have presentation ariaRole", function() {239 expect(header.ariaRole).toBe('presentation');240 });241 242 it("should have presentation role on header el", function() {243 expect(header).toHaveAttribute('role', 'presentation');244 });245 246 it("should have tab role on titleCmp el", function() {247 expect(header.titleCmp).toHaveAttribute('role', 'tab');248 });249 250 it("should have no role on titleCmp textEl", function() {251 expect(header.titleCmp.textEl).not.toHaveAttribute('role');252 });253 254 it("should have FocusableContainer disabled", function() {255 expect(header.enableFocusableContainer).toBe(false);256 });257 });258 });259 });...

Full Screen

Full Screen

Menu.test.js

Source:Menu.test.js Github

copy

Full Screen

...8 <RouterMock>9 <Menu /​>10 </​RouterMock>11 );12 expect(getByText("games")).toHaveAttribute("href", "/​");13 expect(getByText("my games")).toHaveAttribute("href", "/​my-games/​games");14});15test("when user clicks on 'My Games link' it should be redirected to 'my-games' route/​component", async () => {16 const RouterMock = ({ children }) => <BrowserRouter>{children}</​BrowserRouter>;17 const { container, getByText } = render(18 <RouterMock>19 <Menu /​>20 </​RouterMock>21 );22 act(() => {23 fireEvent.click(getByText("games"));24 });25 expect(container).toHaveTextContent(/​games/​);26});27test("when user clicks on 'My Games link' it should be redirected to 'my-games' route/​component", async () => {28 const RouterMock = ({ children }) => <BrowserRouter>{children}</​BrowserRouter>;29 const { container, getByText } = render(30 <RouterMock>31 <Menu /​>32 </​RouterMock>33 );34 act(() => {35 fireEvent.click(getByText("my games"));36 });37 expect(container).toHaveTextContent(/​my games/​);38});39test("when user clicks on 'Genres' it should appear submenu with Genres", async () => {40 const RouterMock = ({ children }) => <BrowserRouter>{children}</​BrowserRouter>;41 const { container, getByText } = render(42 <RouterMock>43 <Menu /​>44 </​RouterMock>45 );46 act(() => {47 fireEvent.click(getByText("genres"));48 });49 50 expect(container).toHaveTextContent(/​genres/​);51 expect(getByText("Action")).toHaveAttribute("href", "/​genre/​4/​Action");52 expect(getByText("Casual")).toHaveAttribute("href", "/​genre/​40/​Casual");53 expect(getByText("Educational")).toHaveAttribute("href", "/​genre/​34/​Educational");54 expect(getByText("Sports")).toHaveAttribute("href", "/​genre/​15/​Sports");55});56test("when user clicks on 'Platforms' it should appear submenu with Platforms", async () => {57 const RouterMock = ({ children }) => <BrowserRouter>{children}</​BrowserRouter>;58 const { container, getByText } = render(59 <RouterMock>60 <Menu /​>61 </​RouterMock>62 );63 act(() => {64 fireEvent.click(getByText("platforms"));65 });66 67 expect(container).toHaveTextContent(/​platforms/​);68 expect(getByText("PlayStation 5")).toHaveAttribute("href", "/​platform/​187/​PlayStation%205");69 expect(getByText("PSP")).toHaveAttribute("href", "/​platform/​17/​PSP");70 expect(getByText("Linux")).toHaveAttribute("href", "/​platform/​6/​Linux");71 expect(getByText("Xbox Series S/​X")).toHaveAttribute("href", "/​platform/​186/​Xbox%20Series%20S%2FX");...

Full Screen

Full Screen

index.test.js

Source:index.test.js Github

copy

Full Screen

...20 it("renders with the role of an <img/​>", () => {21 render(<AmpImg {...imgProps} /​>);22 const ampImg = screen.getByRole("img");23 expect(ampImg).toBeInTheDocument();24 expect(ampImg).toHaveAttribute("alt", "This is so alt");25 expect(ampImg).toHaveAttribute("src", "useTheSource");26 expect(ampImg).toHaveAttribute("width", "1");27 expect(ampImg).toHaveAttribute("height", "1");28 expect(ampImg).toHaveAttribute("layout", "no");29 });30});31describe("AmpUserNotification", () => {32 it("renders AmpUserNotification with default values", () => {33 render(<AmpUserNotification /​>);34 const container = document.querySelector("#amp-user-notification1");35 expect(container).toBeInTheDocument();36 expect(container).toHaveAttribute("layout", "nodisplay");37 expect(container).toHaveAttribute("id", "amp-user-notification1");38 /​/​ BEWARE: Renderer doesn't recognize classNames as classes on amp components39 expect(container).toHaveAttribute("className", "");40 });41 it("renders AmpUserNotification values from props", () => {42 render(<AmpUserNotification {...notificationProps} /​>);43 const container = document.querySelector("#justasillynotification");44 expect(container).toBeInTheDocument();45 expect(container).toHaveAttribute("layout", "somedisplay");46 expect(container).toHaveAttribute("id", "justasillynotification");47 /​/​ BEWARE: Renderer doesn't recognize classNames as classes on amp components48 expect(container).toHaveAttribute("className", "sillyclassname");49 });50 it("renders AmpUserNotification button with default values", () => {51 render(<AmpUserNotification /​>);52 const button = screen.getByRole("button");53 expect(button).toBeInTheDocument();54 expect(button).toHaveAttribute("class", "");55 });56 it("renders AmpUserNotification button with custom values", () => {57 render(<AmpUserNotification {...notificationProps} /​>);58 const button = screen.getByRole("button");59 expect(button).toBeInTheDocument();60 expect(button).toHaveClass("wantcookies");61 expect(button).toHaveTextContent("More cookies?");62 });...

Full Screen

Full Screen

Details.test.js

Source:Details.test.js Github

copy

Full Screen

...11 </​RouterMock>)12 expect(container).toHaveTextContent("Xbox 360");13 expect(container).toHaveTextContent("Linux");14 expect(container).toHaveTextContent("Xbox One");15 expect(getByText("PlayStation 3")).toHaveAttribute("href", "/​platform/​16/​PlayStation%203");16 expect(getByText("PC")).toHaveAttribute("href", "/​platform/​4/​PC");17 expect(getByText("macOS")).toHaveAttribute("href", "/​platform/​5/​macOS");18});19test("Validate Details for Genres", async () => {20 const RouterMock = ({ children }) => <BrowserRouter>{children}</​BrowserRouter>;21 const { container, getByText } = render(22 <RouterMock>23 <Details title="Genres" arr={responseById.genres} path="genre" /​>24 </​RouterMock>)25 expect(container).toHaveTextContent("Shooter");26 expect(container).toHaveTextContent("Puzzle");27 expect(getByText("Shooter")).toHaveAttribute("href", "/​genre/​2/​Shooter");28 expect(getByText("Puzzle")).toHaveAttribute("href", "/​genre/​7/​Puzzle");29});30test("Validate Details for Tags", async () => {31 const RouterMock = ({ children }) => <BrowserRouter>{children}</​BrowserRouter>;32 const { container, getByText } = render(33 <RouterMock>34 <Details title="Tags" arr={responseById.tags} path="tag" /​>35 </​RouterMock>)36 expect(container).toHaveTextContent("Singleplayer");37 expect(container).toHaveTextContent("Multiplayer");38 expect(container).toHaveTextContent("Steam Cloud");39 expect(container).toHaveTextContent("cooperative");40 expect(getByText("Steam Achievements")).toHaveAttribute("href", "/​tag/​40847/​Steam%20Achievements");41 expect(getByText("Atmospheric")).toHaveAttribute("href", "/​tag/​13/​Atmospheric");42 expect(getByText("Co-op")).toHaveAttribute("href", "/​tag/​18/​Co-op");43 expect(getByText("First-Person")).toHaveAttribute("href", "/​tag/​8/​First-Person");...

Full Screen

Full Screen

to-have-attribute.js

Source:to-have-attribute.js Github

copy

Full Screen

...5 OK6 </​button>7 <svg data-testid="svg-element" width="12"></​svg>8 `)9 expect(queryByTestId('ok-button')).toHaveAttribute('disabled')10 expect(queryByTestId('ok-button')).toHaveAttribute('type')11 expect(queryByTestId('ok-button')).not.toHaveAttribute('class')12 expect(queryByTestId('ok-button')).toHaveAttribute('type', 'submit')13 expect(queryByTestId('ok-button')).not.toHaveAttribute('type', 'button')14 expect(queryByTestId('svg-element')).toHaveAttribute('width')15 expect(queryByTestId('svg-element')).toHaveAttribute('width', '12')16 expect(queryByTestId('ok-button')).not.toHaveAttribute('height')17 expect(() =>18 expect(queryByTestId('ok-button')).not.toHaveAttribute('disabled'),19 ).toThrowError()20 expect(() =>21 expect(queryByTestId('ok-button')).not.toHaveAttribute('type'),22 ).toThrowError()23 expect(() =>24 expect(queryByTestId('ok-button')).toHaveAttribute('class'),25 ).toThrowError()26 expect(() =>27 expect(queryByTestId('ok-button')).not.toHaveAttribute('type', 'submit'),28 ).toThrowError()29 expect(() =>30 expect(queryByTestId('ok-button')).toHaveAttribute('type', 'button'),31 ).toThrowError()32 expect(() =>33 expect(queryByTestId('svg-element')).not.toHaveAttribute('width'),34 ).toThrowError()35 expect(() =>36 expect(queryByTestId('svg-element')).not.toHaveAttribute('width', '12'),37 ).toThrowError()38 expect(() =>39 expect({thisIsNot: 'an html element'}).not.toHaveAttribute(),40 ).toThrowError()41 /​/​ Asymmetric matchers42 expect(queryByTestId('ok-button')).toHaveAttribute(43 'type',44 expect.stringContaining('sub'),45 )46 expect(queryByTestId('ok-button')).toHaveAttribute(47 'type',48 expect.stringMatching(/​sub*/​),49 )50 expect(queryByTestId('ok-button')).toHaveAttribute('type', expect.anything())51 expect(() =>52 expect(queryByTestId('ok-button')).toHaveAttribute(53 'type',54 expect.not.stringContaining('sub'),55 ),56 ).toThrowError()...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

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('input[aria-label="Search"]');7 await page.fill('input[aria-label="Search"]', 'playwright');

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { test, expect } = require('@playwright/​test');2test('should have attribute', async ({ page }) => {3 await expect(page.locator('a')).toHaveAttribute('href');4});5const { test, expect } = require('@playwright/​test');6test('should have attribute', async ({ page }) => {7});8const { test, expect } = require('@playwright/​test');9test('should have attribute', async ({ page }) => {10});11I am trying to use the Playwright-Jest API but I am not sure how to import it. Can you please help me with that?12I am trying to use the Playwright-Jest API but I am not sure how to import it. Can you please help me with that?13const { test, expect

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { test, expect } = require('@playwright/​test');2test('test', async ({ page }) => {3 const element = await page.waitForSelector('text=Get Started');4 await expect(element).toHaveAttribute('href', '/​docs/​intro');5});6const { test, expect } = require('@playwright/​test');7test('test', async ({ page }) => {8 const element = await page.waitForSelector('text=Get Started');9 await expect(element).toHaveAttribute('href', '/​docs/​intro');10});11const { test, expect } = require('@playwright/​test');12test('test', async ({ page }) => {13 const element = await page.waitForSelector('text=Get Started');14 await expect(element).toHaveAttribute('href', '/​docs/​intro');15});16const { test, expect } = require('@playwright/​test');17test('test', async ({ page }) => {18 const element = await page.waitForSelector('text=Get Started');19 await expect(element).toHaveAttribute('href', '/​docs/​intro');20});21const { test, expect } = require('@playwright/​test');22test('test', async ({ page }) => {23 const element = await page.waitForSelector('text=Get Started');24 await expect(element).toHaveAttribute('href', '/​docs/​intro');25});26const { test, expect } = require('@playwright/​test');27test('test', async ({ page }) => {28 const element = await page.waitForSelector('text=Get Started');29 await expect(element).toHaveAttribute('href', '/​docs/​intro');30});

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { test, expect } = require('@playwright/​test');2test('test', async ({ page }) => {3 const element = await page.$('text="Get started"');4 expect(element).toHaveAttribute('href', '/​docs/​intro');5});6const { test, expect } = require('@playwright/​test');7test('test', async ({ page }) => {8 expect(page).toHaveAttribute('text="Get started"', 'href', '/​docs/​intro');9});10const { test, expect } = require('@playwright/​test');11test('test', async ({ page }) => {12 const element = await page.$('text="Get started"');13 expect(element).toHaveAttribute('href', '/​docs/​intro');14});15const { test, expect } = require('@playwright/​test');16test('test', async ({ page }) => {17 expect(page).toHaveAttribute('text="Get started"', 'href', '/​docs/​intro');18});19import { test, expect } from '@playwright/​test';20test('test', async ({ page }) => {21 const element = await page.$('text="Get started"');22 expect(element).toHaveAttribute('href', '/​docs/​intro');23});24import { test, expect } from '@playwright/​test';25test('test', async ({ page }) => {26 expect(page).toHaveAttribute('text="Get started"', 'href', '/​docs/​intro');27});28import { test, expect } from '@playwright/​test';29test('test', async ({ page }) => {30 const element = await page.$('

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1const { test, expect } = require('@playwright/​test');2test('check if the attribute exists', async ({ page }) => {3const link = await page.locator('text=Docs');4});5test('check if the attribute exists', async ({ page }) => {6const link = await page.locator('text=Docs');7});

Full Screen

Full Screen

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:

  1. 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.
  2. 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.
  3. 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.
  4. 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.
  5. Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
  6. 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.
  7. 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.
  8. 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.
  9. 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.
  10. 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.
  11. 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.
  12. 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.

... View sample repo... View DocumentationSign up Free
›
_

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

...
Sign up with GoogleSign up with Email
Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful