Annoying rendering bug :( which blocks my annotating

Sometimes, I get this rendered with latest prodigy

then when I try to scroll to the right it does not render :frowning:

attaching my recipe verbatim

# https://prodi.gy/docs/custom-recipes

# autopep8: off

import prodigy

import pathlib
from typing import Generator, TypedDict
import spacy

from smashingalpha.match_patterns import match_all_in_order
from smashingalpha import bottom_up_patterns as bup


sm = spacy.load("en_core_web_sm")

# autopep8: on


equals_pats = [
    ('OF_ENT', bup.OF_ENT),
    ('OF_ENT_ACL', bup.OF_ENT_ACL),
    ('GERUND', bup.GERUND),
    ('QTY_VERB_UNITS', bup.QTY_VERB_UNITS),
    ('GERUND_2', bup.GERUND_2),
    ('QTY_AUX_ATTR', bup.QTY_AUX_ATTR),
    ('QTY_VERB', bup.QTY_VERB),
    ('QTY_AUX', bup.QTY_AUX),
    ('QTY_NUMMOD', bup.QTY_NUMMOD),
    ('ADP_QTY', bup.ADP_QTY),
]


def print_quote(QTY_chunk):
    if ',' in QTY_chunk:
        print(f'"{QTY_chunk}",', end='')
    else:
        print(f"{QTY_chunk},", end='')


def print_subtree_or_chunk(AMOUNT):
    # first try chunk
    if 'chunk' in AMOUNT:
        tmp = AMOUNT['chunk'].text
        print_quote(tmp)
    elif 'subtree' in AMOUNT:
        tmp = ' '.join([tok.text for tok in AMOUNT['subtree']])
        print_quote(tmp)
    else:
        tmp = AMOUNT['tok'].text
        print_quote(tmp)


# https://docs.python.org/3/library/typing.html#typing.TypedDict
class Example(TypedDict):
    html: str
    text: str


def load_my_custom_stream(source: str) -> Generator:
    transcript = pathlib.Path(source).read_text(encoding='utf-8')
    doc = sm(transcript)
    labels = ['CARDINAL', 'MONEY', 'ORDINAL', 'PERCENT', 'QUANTITY']
    for break_into_sents in doc.sents:
        if len([tok.ent_type_ for tok in break_into_sents if tok.ent_type_ in labels]) > 0:
            text = str(break_into_sents)

            s = sm(text)

            pat_matches = match_all_in_order(sm, equals_pats, s, s)

            spans = []
            relations = []
            for pat_name, ms in pat_matches:
                for m in ms:
                    if 'chunk' in m['QTY']:
                        # print_quote(m['QTY']['chunk'].text)
                        # print('chunk:',[t.i for t in m['QTY']['chunk'] ] )

                        qty_tokens = m['QTY']['chunk']
                    else:
                        # print(',', end='')  # no chunk
                        qty_tokens = [m['QTY']['tok']]
                    # print_quote(m['QTY']['tok'].text)

                    head_span = {
                        "start": qty_tokens[0].idx,
                        "end": qty_tokens[-1].idx + len(qty_tokens[-1].text),
                        "token_start": qty_tokens[0].i,
                        "token_end": qty_tokens[-1].i,
                        "label": "QTY"
                    }
                    # print(head_span)

                    if 'chunk' in m['AMOUNT']:
                        amount_tokens = m['AMOUNT']['chunk']
                        # print_quote(tmp)
                    elif 'subtree' in m['AMOUNT']:
                        amount_tokens = m['AMOUNT']['subtree']
                        # print_quote(tmp)
                    else:
                        amount_tokens = [m['AMOUNT']['tok']]

                    child_span = {
                        "start": amount_tokens[0].idx,
                        "end": amount_tokens[-1].idx + len(amount_tokens[-1].text),
                        "token_start": amount_tokens[0].i,
                        "token_end": amount_tokens[-1].i,
                        "label": "AMOUNT"
                    }
                    # print(child_span)

                    spans.append(head_span)
                    spans.append(child_span)

                    rel = {
                        "head": head_span['token_end'],  # 18,
                        "child": child_span['token_end'],  # 43,
                        "head_span": head_span,
                        "child_span": child_span,
                        # "color": "#c5bdf4",
                        "label": "EQUALS"
                    }
                    # print(rel)

                    relations.append(rel)

            tokens = [{"text": tok.text, "start": tok.idx, "end": tok.idx +
                       len(tok.text), "id": tok.i, "ws": tok.is_space} for tok in s]
            ex = {"text": text,
                  "tokens": tokens,
                  "spans": spans,
                  "relations": relations,
                  # https://support.prodi.gy/t/difference-between-input-hash-and-task-hash/3220
                  "_input_hash": hash(text),
                  "_task_hash": hash(text),  # XXX
                  }
            yield ex


blocks = [
    {"view_id": "relations"}
]


@prodigy.recipe(
    "equals-pats-recipe",
    dataset=("Dataset to save answers to", "positional", None, str),
    source=("Source JSONL file", "option", "s", str)
)
# TODO remove view_id
def my_custom_recipe(dataset, source):  # ="./et/ABG/2021-12-31.txt"):
    # Load your own streams from anywhere you want
    stream = load_my_custom_stream(source)

    # https://support.prodi.gy/t/enabling-both-assign-relations-and-select-spans-in-custom-relations-recipe/3647/5?u=ysz
    return {
        "view_id": "blocks",
        "dataset": dataset,  # Name of dataset to save annotations
        "stream": stream,  # Incoming stream of examples
        "config": {"blocks": blocks,
                   "labels": ["EQUALS"],
                   "relations_span_labels": ["QTY", "AMOUNT"],
                   "global_css": ".prodigy-container{max-width: unset;}"
                   },
    }

I'll try to explore this, but just to be explicit ... this issue appears in version 1.12.2? I'm currently exploring a frontend bug that may have been introduced in v1.12, but if there is another frontend issue that's introduced in a patch I'd be very much all ears.

Also, I cannot help but notice ... but your screenshot has two newlines at the end of the sentence ... does that coincide with your rendering issue?

@koaning I now can share the repro , also, I'm not sure why my relations are not showing at all when I'm trying to "review/fix" the dataset

tmp.json is output of prodigy db-out entities > tmp.jsonl of the same recipe but without --fix flag (which is how i created annotations in first place - there's no bug here BTW, everything is just fine with and without Wrap)

"fix" recipe is run like this

PRODIGY_PORT=9090 prodigy numbers-recipe tmp --source ./tmp.jsonl --fix -F recipe.py

repro is here GitHub - wildfluss/prodigy-bug-maybe as I can't attach anything except pics here :slight_smile:

$ prodigy stats

============================== ✨  Prodigy Stats ==============================

Version          1.12.6                        
Location         /Users/y/miniconda3/envs/sa/lib/python3.11/site-packages/prodigy
Prodigy Home     /Users/y/.prodigy             
Platform         macOS-13.5-arm64-arm-64bit    
Python Version   3.11.4                        
Spacy Version    3.5.4                         
Database Name    SQLite                        
Database Id      sqlite                        
Total Datasets   2                             
Total Sessions   35                            

I tried your code, downloaded benepar and ran the recipe with the dataset provided in the Github repo. Here's what the interface looks like when I run this:

PRODIGY_PORT=9090 prodigy numbers-recipe tmp --source ./eaxmples.jsonl --fix -F recipe.py

That is making me think the issue may be related to your browser. Have you tried multiple browsers? Alternatively, do you have any CSS settings configured in your prodigy.json file?

Note that I'm seeing the same behavior with longer sentences.

I've tried Firefox - the same bug when you scroll to the right and try to select rectangle to select Entities as if mouse pointer calculations are off

$ cat ~/.prodigy/prodigy.json 
{

}

Could you make a GIF? I'm not sure if I'm seeing the same thing you are.

CleanShot 2023-08-10 at 16.19.33

This is real bummer since I've used to workaround that bug turning Wrap on and labeling but with longer Entities that trick does not work either :frowning:

BTW I'm not clicking I'm dragging a rectangle over multiple TOKENS as I need 1 Annotation for a span

Another workaround for a workaround is to turn Wrap on and make zoom super small such that I can select span :confused:

In the GIF below I'm both clicking and drag + clicking. I think I'm not seeing the same behavior as you?

CleanShot 2023-08-10 at 16.23.43

But I think I'm a bit confused about what the bug is at this point. I initially had the impression that your problem was that white corners appeared, but am I correct to say that it's also related to an interaction?

By the way, did you check your prodigy.json file? No custom CSS?

Yeah I've copied prodigy.json above already... Okay, tried to record what happens on my end :confused:

sorry, i dont know yet how to record gifs and that was the fastest :confused:

CleanShot 2023-08-10 at 16.33.46

It seems that I am natively able to scroll, but only so far to the right that the tokens allow. But you seem to suffer from something else, which suggests it's a browser related issue. Does updating your browser help? What browsers have you tried?

Could you post it inline again? I can't seem to find it.

Hm, its here Annoying rendering bug :( which blocks my annotating - #10 by ysz

I'm on latest Chrome and tried Firefox as well

BTW, the last time I experienced that it had to do with me providing tokens in examples , this time I'm using add_tokens because that addressed the issue somehow. I sense it could be around that somehow maybe :confused:

Ah! So it's empty, probably why I missed it. So that can't be the issue here.

I understand this sounds crazy, but could you check Safari as well? Just to really rule it out?

I should be running the exact same code as you are, so it feels like it has to be something with your browser. Unless I'm missing something. I even double-checked that I'm running the same Prodigy version.

Its even worse :frowning: I can't scroll past few last tokens

Aug-11-2023 17-56-44

And this what happens if I first scroll to the right , label something and then click Accept , next example is also scrolled to the right but it is not usable anymore :sob:

Aug-11-2023 18-04-08

That is very strange, especially since I am not at all able to reproduce.

CleanShot 2023-08-14 at 14.39.39

I'll notify my colleagues, maybe they will have an idea if what you might experience.