import builtins
import time
from playwright.sync_api import sync_playwright
import re
from PIL import Image, ImageChops
from Pages.PageManagementPage.PageManagementPage import PageManagementPage

def compare_images(image_path1, image_path2, threshold=50):
    """
    比较两个图片是否相似。

    :param image_path1: 第一个图片的路径
    :param image_path2: 第二个图片的路径
    :param threshold: 差异像素数的阈值
    :return: 如果图片相似则返回 True，否则返回 False
    """
    img1 = Image.open(image_path1)
    img2 = Image.open(image_path2)

    # 确保两个图片具有相同的模式和大小
    if img1.mode != img2.mode or img1.size != img2.size:
        return False

        # 计算差异
    diff = ImageChops.difference(img1, img2)
    # 将差异图片转换为灰度，并获取差异像素的总数
    diff_gray = diff.convert('L')
    squared_pixels = [i ** 2 for i in list(diff_gray.getdata())]
    rmse = (sum(squared_pixels) / len(squared_pixels)) ** 0.5

    # 根据均方根误差（RMSE）和阈值判断图片是否相似
    return rmse < threshold
def run(playwright):
    browser = playwright.chromium.launch(headless=False)  # 启动无头模式或带有界面的浏览器
    page = browser.new_page(viewport={'width': 1850, 'height': 1000 })
    page.goto('http://127.0.0.1:18000/#/editing/project/66/page')  # 导航到目标网页

    time.sleep(1)
    page.locator("//*[@id=\"app\"]/div/div[1]/div[2]/div/main/div[2]/main/div[3]/ul/li[1]/i").click()
    time.sleep(1)
    page.get_by_label("基础").locator("div").filter(has_text=re.compile(r"^静态文本$")).click()
    time.sleep(1)
    #按住鼠标左键
    page.mouse.down(button='left')
    #移动坐标
    drop_x, drop_y = 910, 560
    time.sleep(1)
    # 拖动到目标位置
    page.mouse.move(drop_x, drop_y)
    time.sleep(1)
    # 释放鼠标左键
    page.mouse.up(button='left')
    time.sleep(1)
    # 设置字体背景样式
    # page.get_by_role("checkbox", name="粗体 Ctrl+B").click()
    # page.locator("//i[@title=\"粗体 Ctrl+B\"]").click()
    # time.sleep(1)
    ## 斜体
    # page.locator("//i[@title=\"斜体 Ctrl+I\"]").click()
    # time.sleep(1)
    ## 下划线
    # page.locator("//i[@title=\"下划线 Ctrl+U\"]").click()
    # time.sleep(1)
    # page.w_locator = page.locator("div").filter(has_text=re.compile(r"^W$")).get_by_role("spinbutton").click()
    # page.locator("div").filter(has_text=re.compile(r"^W$")).get_by_role("spinbutton").fill('400')
    # # H
    # page.h_locator = page.locator("div").filter(has_text=re.compile(r"^H$")).get_by_role("spinbutton").click()
    # page.locator("div").filter(has_text=re.compile(r"^H$")).get_by_role("spinbutton").fill('200')
    # time.sleep(1)
    # page.get_by_title("粗体 Ctrl+B").click()
    # page.get_by_label("外观").locator("div").filter(has_text=re.compile(r"^背景$")).locator("span").nth(1).click()
    # page.locator(
    #     "div:nth-child(18) > div > .el-color-predefine > .el-color-predefine__colors > div:nth-child(4) > div").click()
    # page.get_by_role("button", name="OK").click()
    ## 设置纯色背景
    # page.get_by_label("外观").locator("div").filter(has_text=re.compile(r"^背景$")).locator("span").nth(1).click()
    # page.locator(
    #     "div:nth-child(18) > div > .el-color-predefine > .el-color-predefine__colors > div:nth-child(4) > div").click()
    # page.get_by_role("button", name="OK").click()

    #设置渐变色背景
    # page.get_by_label("外观").locator("use").click()
    # page.get_by_label("外观").get_by_title("线性渐变").click()
    # time.sleep(2)
    # page.locator("div").filter(has_text=re.compile(r"^W$")).get_by_role("spinbutton").fill('300')
    # # 定位H位置
    # page.locator("div").filter(has_text=re.compile(r"^H$")).get_by_role("spinbutton").fill('200')
    # page.pause()
    # #设置背景图
    # page.get_by_label("外观").locator("use").click()
    # # page.get_by_label("外观").locator("use").click()
    # # page.get_by_label("外观").get_by_title("背景图").click()
    # # // span[text() = "添加图片"]
    # # page.get_by_text("添加图片").click()
    # page.locator("//span[text()=\"添加图片\"]").nth(1).click()
    # page.locator("//div[@class='component-gallery-material-list']//div[1]//div[1]//img[1]").click()
    # page.get_by_role("textbox", name="Select").click()
    # page.get_by_text("拉伸").nth(1).click()
    # time.sleep(2)

    # # 边框
    # page.pause()
    # page.locator("div").filter(has_text=re.compile(r"^边框$")).get_by_role("spinbutton").click()
    # page.locator("div").filter(has_text=re.compile(r"^边框$")).get_by_role("spinbutton").fill("5")
    # page.get_by_placeholder(" ").click()
    # # page.get_by_text("直线").click()
    # # page.get_by_text("圆点").click()
    # page.locator("div").filter(has_text=re.compile(r"^虚线$")).locator("span").click()
    # page.locator(
    #     "div:nth-child(3) > .el-color-picker > .el-color-picker__trigger > .el-color-picker__color > .el-color-picker__color-inner").first.click()
    # page.locator(
    #     "div:nth-child(30) > div > .el-color-predefine > .el-color-predefine__colors > div:nth-child(4) > div").click()
    # # page.get_by_text("无", exact=True).click()
    # time.sleep(2)

    # 阴影
    # page.pause()
    # page.get_by_title("外阴影").click()
    # # page.locator("div:nth-child(3) > .bar > .el-slider > .el-slider__runway > .el-slider__button-wrapper > .el-slider__button").first.click()
    # page.get_by_role("slider", name="slider between 0 and 50").locator("div").first.click()
    # page.get_by_role("tooltip", name="水平： 0 0 垂直： 0 0 模糊： 25 0 大小：").locator("span").nth(1).click()
    # page.locator("div:nth-child(37) > div > .el-color-predefine > .el-color-predefine__colors > div:nth-child(4) > div").click()
    # page.get_by_role("button", name="OK").click()
    # time.sleep(1)
    # page.get_by_title("内阴影（可能被内部内容遮挡）").click()
    # page.get_by_role("slider", name="slider between 0 and 50").locator("div").first.click()
    # page.get_by_role("tooltip", name="水平： 0 0 垂直： 0 0 模糊： 25 0 大小：").locator("span").nth(1).click()
    # page.locator("div:nth-child(43) > div > .el-color-predefine > .el-color-predefine__colors > div:nth-child(6) > div").click()
    # page.get_by_role("button", name="OK").click()

    #圆角
    # page.locator("div").filter(has_text=re.compile(r"^圆角$")).get_by_role("spinbutton").click()
    # page.locator("div").filter(has_text=re.compile(r"^圆角$")).get_by_role("spinbutton").fill("50")
    # time.sleep(1)
    # page.pause()
    # # 不透明度
    # page.get_by_role("slider", name="slider between 0 and").locator("div").nth(1).click()
    # time.sleep(1)

    # 字号
    page.pause()
    # page.get_by_label("文本").get_by_role("img").first.click()
    # page.get_by_text("36", exact=True).scroll_into_view_if_needed()
    # page.get_by_text("36", exact=True).click()
    # #字体颜色
    # page.locator("div:nth-child(2) > .el-color-picker > .el-color-picker__trigger > .el-color-picker__color > .el-color-picker__color-inner").first.click()
    # page.locator("div:nth-child(46) > div > .el-color-predefine > .el-color-predefine__colors > div:nth-child(4) > div").click()
    # time.sleep(1)

    # page.get_by_label("文本").get_by_role("img").nth(1).click()
    # page.get_by_role("tooltip", name="  ").locator("i").nth(1).click()
    # time.sleep(2)
    # page.get_by_label("文本").get_by_role("img").nth(1).click()
    # page.get_by_role("tooltip", name="  ").locator("i").nth(2).click()
    # time.sleep(2)
    # page.get_by_label("文本").get_by_role("img").nth(1).click()
    # page.get_by_role("tooltip", name="  ").locator("i").nth(3).click()
    # time.sleep(2)

    # #全屏截图
    # page.screenshot(path='full_screenshot.png')
    # #拖到画布指定位置
    # region = (340, 290, 1630, 1030)
    # #指定区域截图
    # with Image.open('full_screenshot.png') as img:
    #     cropped_img = img.crop(region)  # region 应该是一个四元组 (left, upper, right, lower)
    #     cropped_img.save('cropped_screenshot.png')
    # #调用图片比对方法
    # is_similar = compare_images('cropped_screenshot.png', 'expected_image.png')
    #
    # # 输出结果
    # if is_similar:
    #     print("图片相似")
    # else:
    #     print("图片不相似")
    browser.close()


with sync_playwright() as playwright:
    run(playwright)