<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="de">
	<id>https://doc.expecco.de/index.php?action=history&amp;feed=atom&amp;title=Testing_Flutter_Applications%2Fen</id>
	<title>Testing Flutter Applications/en - Versionsgeschichte</title>
	<link rel="self" type="application/atom+xml" href="https://doc.expecco.de/index.php?action=history&amp;feed=atom&amp;title=Testing_Flutter_Applications%2Fen"/>
	<link rel="alternate" type="text/html" href="https://doc.expecco.de/index.php?title=Testing_Flutter_Applications/en&amp;action=history"/>
	<updated>2026-04-12T02:48:28Z</updated>
	<subtitle>Versionsgeschichte dieser Seite in expecco Wiki (Version 25.x)</subtitle>
	<generator>MediaWiki 1.44.2</generator>
	<entry>
		<id>https://doc.expecco.de/index.php?title=Testing_Flutter_Applications/en&amp;diff=28717&amp;oldid=prev</id>
		<title>Matilk: /* Web */</title>
		<link rel="alternate" type="text/html" href="https://doc.expecco.de/index.php?title=Testing_Flutter_Applications/en&amp;diff=28717&amp;oldid=prev"/>
		<updated>2023-08-29T15:52:29Z</updated>

		<summary type="html">&lt;p&gt;&lt;span class=&quot;autocomment&quot;&gt;Web&lt;/span&gt;&lt;/p&gt;
&lt;table style=&quot;background-color: #fff; color: #202122;&quot; data-mw=&quot;interface&quot;&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;col class=&quot;diff-marker&quot; /&gt;
				&lt;col class=&quot;diff-content&quot; /&gt;
				&lt;tr class=&quot;diff-title&quot; lang=&quot;de&quot;&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;← Nächstältere Version&lt;/td&gt;
				&lt;td colspan=&quot;2&quot; style=&quot;background-color: #fff; color: #202122; text-align: center;&quot;&gt;Version vom 29. August 2023, 15:52 Uhr&lt;/td&gt;
				&lt;/tr&gt;&lt;tr&gt;
  &lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 8:&lt;/td&gt;
  &lt;td colspan=&quot;2&quot; class=&quot;diff-lineno&quot;&gt;Zeile 8:&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Web ==&lt;/div&gt;&lt;/td&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;== Web ==&lt;/div&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;Web applications can be tested with the [[Selenium WebDriver Plugin/en|Selenium WebDriver Plugin]]. There are a few things to note:&lt;/div&gt;&lt;/td&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;Web applications can be tested with the [[Selenium WebDriver Plugin/en|Selenium WebDriver Plugin]]. There are a few things to note:&lt;/div&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
  &lt;td class=&quot;diff-marker&quot; data-marker=&quot;−&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Flutter generates the element &amp;lt;code&amp;gt;&amp;lt;flt-glass-pane&amp;gt;&amp;lt;/code&amp;gt; which contains the content. However, not as direct children, but &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;as&lt;/del&gt; [[Selenium_WebDriver_Plugin/en#Shadow_Elements|shadow &lt;del style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;tree&lt;/del&gt;]].&lt;/div&gt;&lt;/td&gt;
  &lt;td class=&quot;diff-marker&quot; data-marker=&quot;+&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Flutter generates the element &amp;lt;code&amp;gt;&amp;lt;flt-glass-pane&amp;gt;&amp;lt;/code&amp;gt; which contains the content. However, not as direct children, but &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;inside a&lt;/ins&gt; [[Selenium_WebDriver_Plugin/en#Shadow_Elements|shadow &lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt;root&lt;/ins&gt;]]&lt;ins style=&quot;font-weight: bold; text-decoration: none;&quot;&gt; (see [https://docs.flutter.dev/release/breaking-changes/platform-views-using-html-slots-web Using HTML slots to render platform views in the web])&lt;/ins&gt;.&lt;/div&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Flutter has different [https://docs.flutter.dev/platform-integration/web/renderers web renderes] to display the content: HTML renderer and CanvasKit renderer. You have to use the HTML renderer to be able to see actual elements inside the shadow tree. With the CanvasKit there is only a &amp;lt;code&amp;gt;&amp;lt;canvas&amp;gt;&amp;lt;/code&amp;gt; node that cannot be explored further by Selenium. Even the elements you get with the HTML renderer might not be as convenient as you would like them.&lt;/div&gt;&lt;/td&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;div&gt;* Flutter has different [https://docs.flutter.dev/platform-integration/web/renderers web renderes] to display the content: HTML renderer and CanvasKit renderer. You have to use the HTML renderer to be able to see actual elements inside the shadow tree. With the CanvasKit there is only a &amp;lt;code&amp;gt;&amp;lt;canvas&amp;gt;&amp;lt;/code&amp;gt; node that cannot be explored further by Selenium. Even the elements you get with the HTML renderer might not be as convenient as you would like them.&lt;/div&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br /&gt;&lt;/td&gt;
  &lt;td class=&quot;diff-marker&quot;&gt;&lt;/td&gt;
  &lt;td style=&quot;background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;&quot;&gt;&lt;br /&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;</summary>
		<author><name>Matilk</name></author>
	</entry>
	<entry>
		<id>https://doc.expecco.de/index.php?title=Testing_Flutter_Applications/en&amp;diff=28715&amp;oldid=prev</id>
		<title>Matilk: Die Seite wurde neu angelegt: „= Testing Flutter Applications =  [https://docs.flutter.dev/ Flutter] is a framework to build UIs for multiple platforms. Through this approach the resulting a…“</title>
		<link rel="alternate" type="text/html" href="https://doc.expecco.de/index.php?title=Testing_Flutter_Applications/en&amp;diff=28715&amp;oldid=prev"/>
		<updated>2023-08-29T15:40:41Z</updated>

		<summary type="html">&lt;p&gt;Die Seite wurde neu angelegt: „= Testing Flutter Applications =  [https://docs.flutter.dev/ Flutter] is a framework to build UIs for multiple platforms. Through this approach the resulting a…“&lt;/p&gt;
&lt;p&gt;&lt;b&gt;Neue Seite&lt;/b&gt;&lt;/p&gt;&lt;div&gt;= Testing Flutter Applications =&lt;br /&gt;
&lt;br /&gt;
[https://docs.flutter.dev/ Flutter] is a framework to build UIs for multiple platforms. Through this approach the resulting applications can differ from applications written directly for one platform specifically. This can make those applications harder to automate with expecco than native applications.&lt;br /&gt;
&lt;br /&gt;
== Android ==&lt;br /&gt;
Android apps can be automated with the [[Mobile_Testing_Plugin/en|Mobile Testing Plugin]]. There are no known problems.&lt;br /&gt;
&lt;br /&gt;
== Web ==&lt;br /&gt;
Web applications can be tested with the [[Selenium WebDriver Plugin/en|Selenium WebDriver Plugin]]. There are a few things to note:&lt;br /&gt;
* Flutter generates the element &amp;lt;code&amp;gt;&amp;lt;flt-glass-pane&amp;gt;&amp;lt;/code&amp;gt; which contains the content. However, not as direct children, but as [[Selenium_WebDriver_Plugin/en#Shadow_Elements|shadow tree]].&lt;br /&gt;
* Flutter has different [https://docs.flutter.dev/platform-integration/web/renderers web renderes] to display the content: HTML renderer and CanvasKit renderer. You have to use the HTML renderer to be able to see actual elements inside the shadow tree. With the CanvasKit there is only a &amp;lt;code&amp;gt;&amp;lt;canvas&amp;gt;&amp;lt;/code&amp;gt; node that cannot be explored further by Selenium. Even the elements you get with the HTML renderer might not be as convenient as you would like them.&lt;br /&gt;
&lt;br /&gt;
: CanvasKit is the default renderer. To start the application from the commandline with HTML renderer use&lt;br /&gt;
: &amp;lt;code&amp;gt;flutter run --web-renderer html&amp;lt;/code&amp;gt;&lt;br /&gt;
&lt;br /&gt;
== Windows Automation ==&lt;br /&gt;
Windows applications can be automated with [[WindowsAutomation_Reference_2.0/en|Windows Automation]]. There are no known problems.&lt;/div&gt;</summary>
		<author><name>Matilk</name></author>
	</entry>
</feed>