DEV: flaky toggle flag spec (#28292)

Very similar to move up/down flag problem fixed here -  https://github.com/discourse/discourse/pull/28272

Those are the steps to toggle the flag:
1. click toggle - `saving` CSS class is added;
2. request to backend;
3. `saving` CSS class is removed.

And check if the flag was toggle was:
```ruby
def has_saved_flag?(key)
  has_css?(".admin-flag-item.#{key}.saving")
  has_no_css?(".admin-flag-item.#{key}.saving")
end
```
If the save action is very fast, then the saving class is removed before the first check.

Therefore I decided to invert it, and once action is finished add `saved` CSS class.

Then we can have a quick positive check:

```ruby
def has_saved_flag?(key)
  has_css?(".admin-flag-item.#{key}.saved")
end
```
This commit is contained in:
Krzysztof Kotlarek 2024-08-09 09:56:10 +10:00 committed by GitHub
parent 6cf613d5f5
commit 56524f4bdf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 12 additions and 13 deletions

View File

@ -21,7 +21,7 @@ export default class AdminFlagItem extends Component {
@service router;
@tracked enabled = this.args.flag.enabled;
@tracked isSaving = false;
@tracked isSaved = true;
get canMove() {
return this.args.flag.id !== SYSTEM_FLAG_IDS.notify_user;
@ -49,7 +49,7 @@ export default class AdminFlagItem extends Component {
@action
toggleFlagEnabled(flag) {
this.enabled = !this.enabled;
this.isSaving = true;
this.isSaved = false;
return ajax(`/admin/config/flags/${flag.id}/toggle`, {
type: "PUT",
@ -62,7 +62,7 @@ export default class AdminFlagItem extends Component {
return popupAjaxError(error);
})
.finally(() => {
this.isSaving = false;
this.isSaved = true;
});
}
@ -73,18 +73,18 @@ export default class AdminFlagItem extends Component {
@action
moveUp() {
this.isSaving = true;
this.isSaved = false;
this.args.moveFlagCallback(this.args.flag, "up").finally(() => {
this.isSaving = false;
this.isSaved = true;
this.dMenu.close();
});
}
@action
moveDown() {
this.isSaving = true;
this.isSaved = false;
this.args.moveFlagCallback(this.args.flag, "down").finally(() => {
this.isSaving = false;
this.isSaved = true;
this.dMenu.close();
});
}
@ -95,18 +95,18 @@ export default class AdminFlagItem extends Component {
@action
delete() {
this.isSaving = true;
this.isSaved = false;
this.dialog.yesNoConfirm({
message: i18n("admin.config_areas.flags.delete_confirm", {
name: this.args.flag.name,
}),
didConfirm: () => {
this.args.deleteFlagCallback(this.args.flag).finally(() => {
this.isSaving = false;
this.isSaved = true;
});
},
didCancel: () => {
this.isSaving = false;
this.isSaved = true;
},
});
this.dMenu.close();
@ -117,7 +117,7 @@ export default class AdminFlagItem extends Component {
class={{concatClass
"admin-flag-item"
@flag.name_key
(if this.isSaving "saving")
(if this.isSaved "saved")
}}
>
<td>

View File

@ -64,8 +64,7 @@ module PageObjects
end
def has_saved_flag?(key)
has_css?(".admin-flag-item.#{key}.saving")
has_no_css?(".admin-flag-item.#{key}.saving")
has_css?(".admin-flag-item.#{key}.saved")
end
def has_closed_flag_menu?