{"id":27955,"date":"2024-02-23T09:08:44","date_gmt":"2024-02-23T09:08:44","guid":{"rendered":"https:\/\/www.testingdocs.com\/questions\/?p=27955"},"modified":"2026-02-23T09:12:05","modified_gmt":"2026-02-23T09:12:05","slug":"in-your-web-application-if-you-have-100-pages-do-you-create-100-page-objects","status":"publish","type":"post","link":"https:\/\/www.testingdocs.com\/questions\/in-your-web-application-if-you-have-100-pages-do-you-create-100-page-objects\/","title":{"rendered":"In your web application, if you have 100 pages, do you create 100 Page Objects?"},"content":{"rendered":"<h1>In your web application, if you have 100 pages, do you create 100 Page Objects?<\/h1>\n<p>In a typical <strong data-start=\"130\" data-end=\"157\">Page Object Model (POM)<\/strong> framework, you <em data-start=\"173\" data-end=\"180\">often<\/em> have <strong data-start=\"186\" data-end=\"222\">one Page Object per logical page<\/strong>, but not blindly \u201c100 pages = 100 classes.\u201d It depends on structure and reuse.<\/p>\n<h2 data-start=\"308\" data-end=\"351\">\u2705When You <em data-start=\"322\" data-end=\"329\">Would<\/em> Have 100 Page Objects<\/h2>\n<p data-start=\"353\" data-end=\"356\">If:<\/p>\n<ul data-start=\"357\" data-end=\"476\">\n<li data-start=\"357\" data-end=\"392\">\n<p data-start=\"359\" data-end=\"392\">You truly have 100 distinct pages<\/p>\n<\/li>\n<li data-start=\"393\" data-end=\"438\">\n<p data-start=\"395\" data-end=\"438\">Each page has unique structure and behavior<\/p>\n<\/li>\n<li data-start=\"439\" data-end=\"476\">\n<p data-start=\"441\" data-end=\"476\">There\u2019s little shared functionality<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"478\" data-end=\"534\">Then yes \u2014 you may end up with ~100 Page Object classes.<\/p>\n<p data-start=\"536\" data-end=\"626\">That\u2019s perfectly fine. A large system should have a large, well-structured test framework.<\/p>\n<h2 data-start=\"633\" data-end=\"682\">\ud83d\udeab When You Should NOT Create 100 Page Objects<\/h2>\n<p data-start=\"684\" data-end=\"740\">You <strong data-start=\"688\" data-end=\"701\">shouldn\u2019t<\/strong> create a new Page Object just because:<\/p>\n<ul data-start=\"742\" data-end=\"867\">\n<li data-start=\"742\" data-end=\"783\">\n<p data-start=\"744\" data-end=\"783\">The URL changes but layout is identical<\/p>\n<\/li>\n<li data-start=\"784\" data-end=\"815\">\n<p data-start=\"786\" data-end=\"815\">Only the data\/content changes<\/p>\n<\/li>\n<li data-start=\"816\" data-end=\"867\">\n<p data-start=\"818\" data-end=\"867\">The page is just a variation of the same template<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"869\" data-end=\"877\">Example:<\/p>\n<div class=\"w-full my-4\">\n<div class=\"\">\n<div class=\"relative\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"border corner-superellipse\/1.1 border-token-border-light bg-token-bg-elevated-secondary rounded-3xl\">\n<div class=\"pointer-events-none absolute inset-x-4 top-12 bottom-4\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-border-light\"><\/div>\n<\/div>\n<\/div>\n<div class=\"pointer-events-none absolute inset-x-px top-0 bottom-96\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-bg-elevated-secondary\"><\/div>\n<\/div>\n<\/div>\n<div class=\"corner-superellipse\/1.1 rounded-3xl bg-token-bg-elevated-secondary\">\n<div class=\"relative z-0 flex max-w-full\">\n<div id=\"code-block-viewer\" class=\"q9tKkq_viewer cm-editor z-10 light:cm-light dark:cm-light flex h-full w-full flex-col items-stretch \u037c5 \u037cj\" dir=\"ltr\">\n<div class=\"cm-scroller\">\n<div class=\"cm-content q9tKkq_readonly\">\/products\/1<br \/>\n\/products\/2<br \/>\n\/products\/3<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"\">\n<div class=\"\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<p data-start=\"922\" data-end=\"966\">That\u2019s <strong data-start=\"929\" data-end=\"954\">one ProductPage class<\/strong>, not three.<\/p>\n<hr data-start=\"968\" data-end=\"971\" \/>\n<h2 data-start=\"973\" data-end=\"1003\">\ud83e\udde0 Better Design Principles<\/h2>\n<h3 data-start=\"1005\" data-end=\"1050\">1\ufe0f\u20e3 Think in <em data-start=\"1022\" data-end=\"1034\">Components<\/em>, Not Just Pages<\/h3>\n<p data-start=\"1052\" data-end=\"1092\">Modern applications are component-based.<\/p>\n<p data-start=\"1094\" data-end=\"1105\">Instead of:<\/p>\n<div class=\"w-full my-4\">\n<div class=\"\">\n<div class=\"relative\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"border corner-superellipse\/1.1 border-token-border-light bg-token-bg-elevated-secondary rounded-3xl\">\n<div class=\"pointer-events-none absolute inset-x-4 top-12 bottom-4\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-border-light\"><\/div>\n<\/div>\n<\/div>\n<div class=\"pointer-events-none absolute inset-x-px top-0 bottom-96\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-bg-elevated-secondary\"><\/div>\n<\/div>\n<\/div>\n<div class=\"corner-superellipse\/1.1 rounded-3xl bg-token-bg-elevated-secondary\">\n<div class=\"relative z-0 flex max-w-full\">\n<div id=\"code-block-viewer\" class=\"q9tKkq_viewer cm-editor z-10 light:cm-light dark:cm-light flex h-full w-full flex-col items-stretch \u037c5 \u037cj\" dir=\"ltr\">\n<div class=\"cm-scroller\">\n<div class=\"cm-content q9tKkq_readonly\">HomePage<br \/>\nLoginPage<br \/>\nDashboardPage<br \/>\nSettingsPage<br \/>\n&#8230;<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"\">\n<div class=\"\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<p data-start=\"1166\" data-end=\"1181\">You might have:<\/p>\n<div class=\"w-full my-4\">\n<div class=\"\">\n<div class=\"relative\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"border corner-superellipse\/1.1 border-token-border-light bg-token-bg-elevated-secondary rounded-3xl\">\n<div class=\"pointer-events-none absolute inset-x-4 top-12 bottom-4\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-border-light\"><\/div>\n<\/div>\n<\/div>\n<div class=\"pointer-events-none absolute inset-x-px top-0 bottom-96\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-bg-elevated-secondary\"><\/div>\n<\/div>\n<\/div>\n<div class=\"corner-superellipse\/1.1 rounded-3xl bg-token-bg-elevated-secondary\">\n<div class=\"relative z-0 flex max-w-full\">\n<div id=\"code-block-viewer\" class=\"q9tKkq_viewer cm-editor z-10 light:cm-light dark:cm-light flex h-full w-full flex-col items-stretch \u037c5 \u037cj\" dir=\"ltr\">\n<div class=\"cm-scroller\">\n<div class=\"cm-content q9tKkq_readonly\">BasePage<br \/>\nHeaderComponent<br \/>\nSidebarComponent<br \/>\nFooterComponent<br \/>\nLoginFormComponent<br \/>\nUserTableComponent<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"\">\n<div class=\"\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<p data-start=\"1288\" data-end=\"1344\">Pages then <strong data-start=\"1299\" data-end=\"1321\">compose components<\/strong>, reducing duplication.<\/p>\n<hr data-start=\"1346\" data-end=\"1349\" \/>\n<h3 data-start=\"1351\" data-end=\"1390\">2\ufe0f\u20e3 Use Inheritance or Base Classes<\/h3>\n<p data-start=\"1392\" data-end=\"1418\">Common functionality like:<\/p>\n<ul data-start=\"1420\" data-end=\"1486\">\n<li data-start=\"1420\" data-end=\"1432\">\n<p data-start=\"1422\" data-end=\"1432\">Navigation<\/p>\n<\/li>\n<li data-start=\"1433\" data-end=\"1452\">\n<p data-start=\"1435\" data-end=\"1452\">Waiting utilities<\/p>\n<\/li>\n<li data-start=\"1453\" data-end=\"1469\">\n<p data-start=\"1455\" data-end=\"1469\">Common buttons<\/p>\n<\/li>\n<li data-start=\"1470\" data-end=\"1486\">\n<p data-start=\"1472\" data-end=\"1486\">Shared layouts<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"1488\" data-end=\"1503\">Should go in a:<\/p>\n<div class=\"w-full my-4\">\n<div class=\"\">\n<div class=\"relative\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"border corner-superellipse\/1.1 border-token-border-light bg-token-bg-elevated-secondary rounded-3xl\">\n<div class=\"pointer-events-none absolute inset-x-4 top-12 bottom-4\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-border-light\"><\/div>\n<\/div>\n<\/div>\n<div class=\"pointer-events-none absolute inset-x-px top-0 bottom-96\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-bg-elevated-secondary\"><\/div>\n<\/div>\n<\/div>\n<div class=\"corner-superellipse\/1.1 rounded-3xl bg-token-bg-elevated-secondary\">\n<div class=\"relative z-0 flex max-w-full\">\n<div id=\"code-block-viewer\" class=\"q9tKkq_viewer cm-editor z-10 light:cm-light dark:cm-light flex h-full w-full flex-col items-stretch \u037c5 \u037cj\" dir=\"ltr\">\n<div class=\"cm-scroller\">\n<div class=\"cm-content q9tKkq_readonly\">BasePage<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"\">\n<div class=\"\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<p data-start=\"1523\" data-end=\"1544\">Each page extends it.<\/p>\n<hr data-start=\"1546\" data-end=\"1549\" \/>\n<h3 data-start=\"1551\" data-end=\"1578\">3\ufe0f\u20e3 Group Similar Pages<\/h3>\n<p data-start=\"1580\" data-end=\"1592\">If you have:<\/p>\n<ul data-start=\"1593\" data-end=\"1639\">\n<li data-start=\"1593\" data-end=\"1609\">\n<p data-start=\"1595\" data-end=\"1609\">CreateUserPage<\/p>\n<\/li>\n<li data-start=\"1610\" data-end=\"1624\">\n<p data-start=\"1612\" data-end=\"1624\">EditUserPage<\/p>\n<\/li>\n<li data-start=\"1625\" data-end=\"1639\">\n<p data-start=\"1627\" data-end=\"1639\">ViewUserPage<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"1641\" data-end=\"1658\">You might design:<\/p>\n<div class=\"w-full my-4\">\n<div class=\"\">\n<div class=\"relative\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"h-full min-h-0 min-w-0\">\n<div class=\"border corner-superellipse\/1.1 border-token-border-light bg-token-bg-elevated-secondary rounded-3xl\">\n<div class=\"pointer-events-none absolute inset-x-4 top-12 bottom-4\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-border-light\"><\/div>\n<\/div>\n<\/div>\n<div class=\"pointer-events-none absolute inset-x-px top-0 bottom-96\">\n<div class=\"pointer-events-none sticky z-40 shrink-0 z-1!\">\n<div class=\"sticky bg-token-bg-elevated-secondary\"><\/div>\n<\/div>\n<\/div>\n<div class=\"corner-superellipse\/1.1 rounded-3xl bg-token-bg-elevated-secondary\">\n<div class=\"relative z-0 flex max-w-full\">\n<div id=\"code-block-viewer\" class=\"q9tKkq_viewer cm-editor z-10 light:cm-light dark:cm-light flex h-full w-full flex-col items-stretch \u037c5 \u037cj\" dir=\"ltr\">\n<div class=\"cm-scroller\">\n<div class=\"cm-content q9tKkq_readonly\">UserPage (handles multiple modes)<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"\">\n<div class=\"\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<p data-start=\"1703\" data-end=\"1737\">Instead of three separate objects.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In your web application, if you have 100 pages, do you create 100 Page Objects? In a typical Page Object Model (POM) framework, you often have one Page Object per logical page, but not blindly \u201c100 pages = 100 classes.\u201d It depends on structure and reuse. \u2705When You Would Have 100 Page Objects If: You [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[50],"tags":[],"class_list":["post-27955","post","type-post","status-publish","format-standard","hentry","category-testing-questions","has-post-title","has-post-date","has-post-category","has-post-tag","has-post-comment","has-post-author",""],"_links":{"self":[{"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/posts\/27955","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/comments?post=27955"}],"version-history":[{"count":1,"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/posts\/27955\/revisions"}],"predecessor-version":[{"id":27956,"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/posts\/27955\/revisions\/27956"}],"wp:attachment":[{"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/media?parent=27955"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/categories?post=27955"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.testingdocs.com\/questions\/wp-json\/wp\/v2\/tags?post=27955"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}