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

[Bug] The decorator created does not take effect #4574

Open
2 tasks done
kkk-yu opened this issue Jun 21, 2024 · 0 comments
Open
2 tasks done

[Bug] The decorator created does not take effect #4574

kkk-yu opened this issue Jun 21, 2024 · 0 comments

Comments

@kkk-yu
Copy link

kkk-yu commented Jun 21, 2024

Reproducible in vscode.dev or in VS Code Desktop?

  • Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

Monaco Editor Playground Link

No response

Monaco Editor Playground Code

No response

Reproduction Steps

No response

Actual (Problematic) Behavior

It doesn't really work.

Expected Behavior

I want to render the specified content green

Additional Context

function getPosition(v: string) {
  if (!editor) return;
  const model = editor.getModel()!;
  const content = editor.getValue();
  const startIndex = content.indexOf(v);
  if (startIndex === -1) {
    return;
  }
  const endIndex = startIndex + v.length;
  // Get start and end positions
  const startPosition = model.getPositionAt(startIndex);
  const endPosition = model.getPositionAt(endIndex);

  const startLineNumber = startPosition.lineNumber;
  const startColumn = startPosition.column;
  const endLineNumber = endPosition.lineNumber;
  const endColumn = endPosition.column;

  return { startLineNumber, startColumn, endLineNumber, endColumn };
}

editor.setValue(value);
const position = getPosition(props.data.version);
if (position) {
  const { startLineNumber, startColumn, endLineNumber, endColumn } = position;
  editor.createDecorationsCollection([
    {
      range: new monaco.Range(startLineNumber, startColumn, endLineNumber, endColumn),
      options: {
        inlineClassName: 'version-decorations',
      },
    },
  ]);

.version-decorations {
  font-weight: bold;
  font-style: oblique;
  color: green !important;
}
  
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant