Thêm tài sản id hoặc tên hoặc phương tiện nhận dạng khác cho các ứng dụng Flutter Web?

Viết một ứng dụng Flutter Web, tôi cố gắng tận dụng khung Kiểm tra giao diện người dùng web dựa trên Selenium. Đáng buồn là tôi không xác định được Phần tử HTML đại diện cho một tiện ích rung nhất định bằng thuộc tính id hoặc tên của nó. Khóa widget không có trong tài liệu HTML.

Tôi quản lý để sử dụng nội dung tiện ích văn bản để tìm phần văn bản của tiện ích con và có thể tìm thấy phần tử cha của nó đại diện cho tiện ích chứa văn bản nhưng điều này không thành công cho hình ảnh, khung vẽ, v.v.

Có bất kỳ cơ chế nào tôi có thể sử dụng để thêm id / name (hoặc bất kỳ phương tiện nhận dạng nào khác) vào súp thẻ HTML không?

Sử dụng JavaScript, có cách nào để duyệt qua cây widget logic bên trong và từ đó kết luận phần tử HTML đại diện (ví dụ như theo vị trí và kích thước của nó) không?

— Martin Kersten
nguồn

Xin chào @Martin, chính xác thì bạn đang cố gắng đạt được điều gì? Bạn đang cố gắng sử dụng Selenium và không thể tham khảo vật phẩm? Hay bạn đang sửa đổi cấu trúc DOM / HTML? Bất kỳ cơ hội nào bạn có thể chia sẻ một số ví dụ về HTML là gì và nên là gì? Ngoài ra, ví dụ về chính xác những gì bạn đang hy vọng sẽ làm gì? Cảm ơn bạn.

— Lefty G Balogh

Tôi muốn xác định các thành phần HTML riêng lẻ và các tiện ích mà chúng đại diện. Tôi muốn (dễ dàng) kết thúc để kiểm tra đầu ra HTML của ứng dụng Flutter Web theo cách chúng ta thường làm. Đây là một phần lớn yêu cầu chúng tôi chuyển sang Flutter Web.

— Martin Kersten

Có lẽ bạn nên thử với Puppeteer hoặc Cypress . Tôi đã có một số thời gian khó khăn khi sử dụng trình điều khiển web Selenium trong quá khứ.

— Christos Lytras

Tôi đã kiểm tra cách kiểm tra được viết trong cả hai khung kiểm tra. Sử dụng những người tôi sẽ chịu cùng một vấn đề. Flutter không thêm bất cứ điều gì vào HTML để xác định một số Widgets nhất định có thể.

— Martin Kersten

Tôi vẫn khó có thể tưởng tượng toàn bộ sự hỗn loạn này mà không có bất kỳ mẫu nguồn nào, nhưng tôi đã xem xét các trang rung ví dụ và chúng chắc chắn là kỳ lạ. Xin lỗi nếu bạn đã xem xét nó: flutter dường như đi kèm với các công thức riêng để thử nghiệm: flutter.dev/docs/cookbook/testing/widget/finder Điều này có ý nghĩa gì với bạn trong ngữ cảnh của bạn không?

— Lefty G Balogh

Câu trả lời:

Tôi không nghĩ rằng đó là cách đúng đắn để sử dụng bất kỳ loại khung thử nghiệm Selenium nào cho Flutter Web.

Lý do cho điều đó là bạn (với tư cách là nhà phát triển web) không có quyền kiểm soát đối với DOM được tạo như thế nào. Điều đó có nghĩa là bạn không thể sử dụng XPath và các phương tiện khác để chọn các yếu tố.

Tôi cho rằng cách duy nhất để kiểm tra các ứng dụng Flutter (bao gồm cả Flutter Web) là sử dụng Flutter Driver: https://api.flutter.dev/flutter/flutter_do/flutter_do-l Library.html

— Alex Radzishevsky
nguồn

Tôi thà sử dụng hình ảnh 'nhận dạng' như tôi sử dụng để thử nghiệm ứng dụng di động. Ngăn xếp công cụ chúng tôi sử dụng để mô tả các kiểm tra web của chúng tôi / E + E không hoạt động tốt với các khả năng kiểm tra rung (hoặc chúng tôi vẫn bỏ lỡ một điểm).

— Martin Kersten

Hiện tại bạn không thể liên tục thêm thông tin nhận dạng vào kết xuất Widgets trên các thiết bị khác nhau.

Để đạt được mục tiêu của bạn, tuy nhiên, bạn có thể sử dụng Flutter Driver. Gói flutter_do Dart được thiết kế đặc biệt để cho phép thử nghiệm giao diện người dùng các ứng dụng Flutter và cung cấp API cho các ứng dụng trên các thiết bị thực, giả lập hoặc giả lập. Để bắt đầu với thử nghiệm Flutter Driver, bạn cần:

Nhận gói flutter_do

Thiết lập thư mục kiểm tra

Tạo một ứng dụng cụ để thử nghiệm

Viết kiểm tra giao diện người dùng bằng flutter_do API

Thực hiện kiểm tra giao diện người dùng trong thiết bị hoặc trình giả lập thực

Để tìm tiện ích Flutter, bạn có thể sử dụng serializable Downloader, ví dụ:

test('verify the text on home screen', () async {
    SerializableFinder message = find.text("Widget Title");
    await driver.waitFor(message);
    expect(await driver.getText(message), "Widget Title");
});

Để biết thêm thông tin kiểm tra:

— realAlexBarge
nguồn