how to take fullpage screenshot using playwright

Question

I'm new to browser automation

I'm trying to take a screenshot of a full webpage (example: https://www.apple.com/) using the below code

import time
from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.webkit.launch(headless=False)
    context = browser.new_context(viewport={"width": 1200, "height": 500})
    page = context.new_page()
    page.goto("https://www.apple.com")

    
    # Wait for the page to load completely
    page.wait_for_load_state("load")

    # Scroll to the bottom of the page to load additional content
    # page.evaluate("window.scrollTo(0, document.body.scrollHeight);")

    time.sleep(5)

    # Capture a screenshot of the entire page
    page.screenshot(full_page=True, path="full_page_screenshot1.png")

    browser.close()

I am getting output like this https://i.stack.imgur.com/1euM7.jpg

But my output should look like this https://i.stack.imgur.com/qTCeH.png