1

我正在使用带有C#的Webdriver，问题是Webdriver 无法测试设计，所以我尝试进行截图比较，因为我在大网站上工作，每天都有新的未来，新的变化，所以我不知道在哪里或哪个浏览器设计没有损坏。我的问题是你知道任何工具、框架、项目或一些想法吗？

我已经写了一些东西，但它不是那么完美，我的代码在不同的浏览器和版本上制作了网站截图，然后将它们剪切并与演示屏幕进行比较。如果错误像素超过 5%，则测试正在下降。

PS我是小学生）

如果将来有人需要它，我的一些代码：

        var screenshot = ((ITakesScreenshot)Global.Driver).GetScreenshot();
        screenshot.SaveAsFile(dirHomePage + "homepage.png", ImageFormat.Png);
        var mainImg = new Bitmap(File.OpenRead(dirHomePage + "homepage.png"));
        var section = new Rectangle(new Point(0, 0), new Size(mainImg.Width, 153));
        this.header = this.CropImage(mainImg, section);
        this.header = this.ClearImage(this.header, Color.White, 264, mainImg.Width, 30, 60);
        ImageComparison(this.header, this.demoHeader);

    public Bitmap ClearImage(Bitmap source, Color color, int fromW, int toW, int fromH, int toH)
    {
        Bitmap bmp = source;
        for (int i = fromW; i < toW; i++)
        {
            for (int j = fromH; j < toH; j++)
            {
                bmp.SetPixel(i, j, color);
            }
        }

        return bmp;
    }

    public Bitmap CropImage(Bitmap source, Rectangle section)
    {
        Bitmap bmp = new Bitmap(section.Width, section.Height);
        Graphics g = Graphics.FromImage(bmp);
        g.DrawImage(source, 0, 0, section, GraphicsUnit.Pixel);
        return bmp;
    }

    public void ImageComparison(Bitmap firstImg, Bitmap secondImg)
    {
        bool match = false;
        int nrBadPixels = 0;
        if (firstImg.Width.Equals(secondImg.Width) && firstImg.Height.Equals(secondImg.Height))
        {
            double acceptedProcent = (firstImg.Width * firstImg.Height) * 0.05;
            for (int i = 0; i < firstImg.Width; i++)
            {
                for (int j = 0; j < firstImg.Height; j++)
                {
                    string firstImgRef = firstImg.GetPixel(i, j).ToString();
                    string secondImgRef = secondImg.GetPixel(i, j).ToString();
                    if (firstImgRef != secondImgRef)
                    {
                        nrBadPixels++;
                        if (nrBadPixels > acceptedProcent)
                        {
                            match = false;
                            break;
                        }
                        match = true;
                    }
                }
            }
        }

        Assert.IsTrue(match);
    }
4

2 回答 2

1

我想你可以试试Sikuli 。

Sikuli Script 自动执行您在屏幕上看到的任何内容。它使用图像识别来识别和控制 GUI 组件。当无法轻松访问 GUI 的内部或源代码时，它很有用。

但是，这只是为了布局和东西，如果你需要测试基于 DOM 的功能，Selenium WebDriver 仍然是最好的选择。而且，它更像 Selenium IDE，而不是 Selenium WebDriver C#。您可能会发现这个 wiki 页面很有趣，SikuliWebDriver。

于 2013-05-16T08:12:54.987 回答
0

我写了一个小代码片段来解决你的问题。它滚动到元素加上宽度和高度，然后只剪切元素的区域。

看看我的博客 https://modern-coding-today.blogspot.com/2018/11/c-net-make-partial-screenshots-in.html

public static Bitmap GetElementScreenshot(IWebElement element) {
    IWebDriver driver = ((IWrapsDriver)element).WrappedDriver;
    Actions actions = new Actions(driver);
    actions.MoveToElement(element);
    actions.Perform();
    IJavaScriptExecutor executor = (IJavaScriptExecutor)driver;
    int yOffset = Convert.ToInt32(executor.ExecuteScript($"window.scrollBy({element.Size.Width}, {element.Size.Height}); return window.pageYOffset;"));
    Screenshot sc = ((ITakesScreenshot)driver).GetScreenshot();
    var img = Image.FromStream(new MemoryStream(sc.AsByteArray)) as Bitmap;
    return img.Clone(new Rectangle(element.Location.X, element.Location.Y - yOffset, element.Size.Width, element.Size.Height), img.PixelFormat);
}

在我的博客中，您还会发现此代码作为 IWebDriver 扩展。

于 2018-11-06T08:19:03.053 回答