flutter: what should I test in a page? - flutter

I have finished all the pages and I want to start testing. I have read the docs about unit test. Also, I learned the test_widget.dart in an init flutter project. (the counter project you must know). But when come to my own pages, for example, a login page, I have little idea about what should I test. Could you please give me some tips?

Related

Is there something missing in the Flutter introduction?

I am currently learning Flutter and followed the official introduction on the Flutter website, which worked without any problems. On the page there was a link to part 2 on Google Developers Codelab.
First there is some information, including a code template for the second part, which is the same as my code on part 1. Then the actual coding part starts and here is the problem. It says to make changes in a widget that I don't have and wasn't mentioned before. The problem is that I know basically nothing about flutter and don't know where it belongs and also the whole context is missing, so I don't know what else is in the widget.
At the end of the chapter is again a code template given in case of problems, but again there is no trace of the widget. Maybe I've overlooked something, but I'm pretty sure that there is an error at this point.
Edit
This is the problem:
And this is their code template without any trace of a _buildRow() method

Which is the better way to white-label a flutter app

I have one project that I have to sell to another clients, so I wanna found a way to unify the code to, when I release some updates, I have to manipulate only one code (and, of course, keeping the specificities from each one)
I found an article HERE which the guy creates a new folder named 'config' and set some variables there to be used in the parent project. I tried this but find out that would be very tough to do because the first app was developed specifically by one client, and with it I would need so much time to make all the aspects dynamic... Another problem is firebase, in first app I used firebase but in the second i won't. How to make it possible?
And in this article they say about 'flavours' that can be used to do something similar.
Someone knows about this approaches or there is another to reach my goal? With flavours I will have less re-factor than with config?
I appreciate any help
A third way to do this with no client specific app configuration is to make an api call to get back your client specific theme, and then set the flutter theme based on this.
If you need web support see below:
First update your assets in index.html that aren't white labeled, leaving stubs in their place that we'll fill in later. i.e.
Next show a nice loading indicator while flutter loads. To do this, just put the html for it in the body element of the index.html file.
Finally update the webpage title and favicon using javascript inside Flutter. I used package
universal_html: 2.0.8
https://pub.dev/packages/universal_html
then you can update the favicon
import 'package:universal_html/html.dart';
var favicon = document.getElementById('favicon');
favicon?.setAttribute('href','insertLinkToYourImage');
Updating the title can be accomplished in various normal ways like just setting the title attribute of a MaterialApp widget.

Flutter web website takes a long time to load initially

I am currently creating a flutter web application for a client, however, when the website is navigated to for the first time in the browser, the page loads to a blank screen and a few seconds later shows the actual homepage widgets. After the page has been cached in it seems to be quicker on subsequent reloads.
Is there something that I can change about my flutter web app in order to decrease this initial load time? I know that flutter web is still in beta, so it may just be that -- will this be fixed when flutter web becomes deployment ready?
Any help is appreciated.
Before running certain views, especially the first time the web app is built, it takes a moment to load everything up. The best thing to do in such case is to add a loading screen/widget.
You should have a look at this article by Juan Curti.
I think a found a solution for that, let me know if it works!
I posted it here... Basically you need to add two lines to the <head>...</head> tag on your index file to start loading the CanvasKit binary from the beginning.
<script src="https://unpkg.com/canvaskit-wasm#0.33.0/bin/canvaskit.js"></script>
<link rel="preload" href="https://unpkg.com/canvaskit-wasm#0.33.0/bin/canvaskit.wasm" as="fetch" crossOrigin="anonymous">
Be careful with which URL you use above, there is a better explanation on the link above! Hope it helps at least a bit with your initial loading time!
Consider using ditman's solution in
https://github.com/flutter/flutter/issues/76009#issuecomment-1095663169
He puts an example of his solution at
https://dit-tests.web.app

Advanced features with Flutter Driver (or Silenium/Ghost Inspector)

Looking for a UI integration test strategy for Flutter. We'd love to use Silenium/Ghost Inspector but seems that is not practical due to lack of html id's or CSS classes in Flutter (Add id or name property or other means of identification for Flutter Web applications?). Or has anyone found a way round that?
In the meantime Flutter Driver has only very basic documentation for simple tests like finding a button and pressing the button. Anyone know if I can do other operations like navigate to a specific page (e.g. using a # url fragment), test a link which leads to an external site, check visual setup of the page against an image, and other such tests which would be standard in Silenium and the like.
Thanks!!
Well seems Flutter Driver is still very limited so I have instead found a strategy for using Selenium, posted full details here:
Strategy to use Selenium browser testing with Flutter Web apps

How to migrate/update a Ionic1 to Ionic4 app

noob here.
I did an app on ionic, is pretty basic just images, buttons and text; the buttons are linked to another page and stuf like that, i mean there is no logic still like a loop or something.
What i was asked is to update the project of the app that is on ionic1 to ionic4 because someone that is willing to help me works with ionic4 and not ionic1.
Is there a guide for noobs to do this? i have been looking on google but nothing pop up
i read this but to a noob makes no sense https://ionicframework.com/blog/a-guide-for-migrating-to-ionic-4-0/
But the solution is kind of like this:
"Then, create a new Ionic 4 application and begin porting features over. Once the team is comfortable that the new app is stable, you can shut down the Ionic 1 app"
Thanks in advance!
The reason why there isn't a straightforward guide is because an absolutely huge amount of changes were made.
Take a look at the breaking.md document on the repo, its over 1000 lines long:
https://github.com/ionic-team/ionic/blob/master/angular/BREAKING.md
There is a linting tool that could help you identify the main areas that you need to migrate, and if it's just a simple app like you say then it could do a lot of the work for you:
https://github.com/ionic-team/v4-migration-tslint
Beyond that the only real way is to look at every tag and then search it and see if its listed in the breaking change. If it is then update it.
The reason why the official advice is to make a new app and port features over is that otherwise you will have a non-working app basically forever up to the last moment where it starts working. Not the best way to learn so they say start with a new working app and build bits in it that are already Ionic 4.