Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

position:absoluted 元素获取offsetLeft、offsetTop失败为null #1448

Open
pba-cra opened this issue Jul 19, 2022 · 0 comments
Open

position:absoluted 元素获取offsetLeft、offsetTop失败为null #1448

pba-cra opened this issue Jul 19, 2022 · 0 comments
Assignees
Labels
bug Something isn't working

Comments

@pba-cra
Copy link

pba-cra commented Jul 19, 2022

使用的 Kraken 版本 | What version of kraken are you using

main

重现步骤 | Steps To Reproduce

重现代码 | Code example:

       const BODY = document.getElementsByTagName('body')[0];
        function setElementStyle(dom, object) {
            if (object == null) return;
            for (let key in object) {
                if (object.hasOwnProperty(key)) {
                    dom.style[key] = object[key];
                }
            }
        }

        function createElementWithStyle(tag, style, child) {
            const el = document.createElement(tag);
            setElementStyle(el, style);
            if (Array.isArray(child)) {
                child.forEach(c => el.appendChild(c));
            } else if (child) {
                el.appendChild(child);
            }
            return el;
        }

        function createText(content) {
            return document.createTextNode(content);
        }
        let target;
        let div;
        div = createElementWithStyle(
            'div', {
                overflow: 'auto',
                height: '100px',
                width: '200px',
                'background-image': 'linear-gradient(#e66465, #9198e5)',
            },
            [
                (target = createElementWithStyle(
                    'div', {
                        position: 'absolute',
                    },
                    [createText(`Modified text`)]
                )),
                createElementWithStyle('div', {
                    width: '400px',
                    height: '10px',
                }),
            ]
        );
        BODY.appendChild(div);
        div.scrollLeft = 1000;
        console.log(target.offsetLeft);

预期结果 | Expected results:

打印为0

实际结果 | Actual results:
打印为null
同时 assert断言异常

Matrix4 getLayoutTransformTo(RenderObject current, RenderObject ancestor, { bool excludeScrollOffset = false }) {
  final List<RenderObject> renderers = <RenderObject>[];
  for (RenderObject renderer = current; renderer != ancestor; renderer = renderer.parent! as RenderObject) {
    renderers.add(renderer);
    assert(renderer.parent != null); -->报错
  }
  renderers.add(ancestor);

  final Matrix4 transform = Matrix4.identity();
  for (int index = renderers.length - 1; index > 0; index -= 1) {
    RenderObject parentRenderer = renderers[index];
    RenderObject childRenderer = renderers[index - 1];
    // Apply the layout transform for renderBoxModel and fallback to paint transform for other renderObject type.
    if (parentRenderer is RenderBoxModel) {
      parentRenderer.applyLayoutTransform(childRenderer, transform, excludeScrollOffset);
    } else {
      parentRenderer.applyPaintTransform(childRenderer, transform);
    }
  }

  return transform;
}
@pba-cra pba-cra added the bug Something isn't working label Jul 19, 2022
@pba-cra pba-cra self-assigned this Jul 19, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant