editor-js / editor-js/image

Custom action tool icon (wrongfully) initially active

Open
#143 3 comments 1 reaction 0 assignees View on GitHub
Dominant language
TypeScript
Stars
285
Forks
307
PR merge metrics
No merged PRs in 30d

Description

I added a simple class toggling action as follows

```js
//...
config: {
actions: [
{
icon: ``,
name: "centered",
title: "Centered",
},
],
//...
```

The first time the tuning menu is displayed, the icon is active and clicking it correctly applies the `image-tool--centered` but the icon is set to inactive.

![image](https://user-images.githubusercontent.com/1626868/117641185-04ac3380-b1c5-11eb-8357-29d36ae62dce.png)

![image](https://user-images.githubusercontent.com/1626868/117641246-17bf0380-b1c5-11eb-9e54-559854448b60.png)

The next times the tuning menu is displayed the issue is gone and the icon's active state correctly reflects the presence of the css class.

![image](https://user-images.githubusercontent.com/1626868/117641445-4f2db000-b1c5-11eb-9a08-afd12c61b354.png)

Has line 87 of tunes.js anything to do with this behaviour?

```js
el.classList.toggle(this.CSS.buttonActive, toolData[tune.name]);
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.