refactor(angular): use [flagNameFeatureFlag] selector for generated directives

[tomflenner]

This PR

Refactors the Angular directive selector generated by the CLI to append the FeatureFlag suffix.

Previously, directives were generated using:

selector: '[{{ .Key | ToCamel }}]'

They are now generated as:

selector: '[{{ .Key | ToCamel }}FeatureFlag]'

This change aligns the generated directives with the existing Angular SDK naming convention (<type>FeatureFlag, e.g. booleanFeatureFlag, stringFeatureFlag) and reduces the risk of selector collisions with:

• Business domain input bindings
• Other Angular directives
• Native HTML attributes

Example before:

<div [checkout]></div>

Example after:

<div [checkoutFeatureFlag]></div>

This makes the intent explicit and prevents conflicts with application-level naming.

⚠️ This is a breaking change, as existing templates using the previous selector format must be updated.

• refactors Angular directive selector generation
• improves consistency with Angular SDK conventions
• reduces potential naming collisions

Related Issues

Fixes #225

Notes

Depending on the project’s release policy, this may require a major version bump due to the selector change.

How to test

1. Run the integration test suite using make test-integration
2. Generate Angular code from a sample configuration:

openfeature generate angular -i path/to/manifest.json -o output/directory

[gemini-code-assist]

Summary of Changes

Hello @tomflenner, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request refactors the Angular directive generation logic to append a FeatureFlag suffix to all generated selectors. This enhances consistency with the Angular SDK and mitigates potential naming conflicts with application-specific bindings or other directives. While this is a breaking change, it improves clarity and maintainability for future Angular feature flag implementations.

Highlights

• Directive Selector Refactoring: The Angular directive selectors generated by the CLI have been refactored to append a FeatureFlag suffix, changing [checkout] to [checkoutFeatureFlag].
• Improved Consistency: This change aligns the generated directives with the existing Angular SDK naming convention (e.g., booleanFeatureFlag) for better consistency.
• Reduced Naming Collisions: The new naming convention reduces the risk of selector collisions with business domain input bindings, other Angular directives, and native HTML attributes.
• Breaking Change: This refactoring is a breaking change, requiring existing templates that use the previous selector format to be updated.

Changelog

• internal/cmd/testdata/success_angular.golden
  • Updated example usage of feature flag directives in documentation comments to reflect the new FeatureFlag suffix for selectors and input properties.
• internal/generators/angular/angular.tmpl
  • Modified the template for generating Angular directives to append FeatureFlag to selectors and input property names.
• test/angular-integration/specs/directives.spec.ts
  • Updated Angular integration tests to use the new FeatureFlag suffix for directive selectors in templates.
• test/angular-integration/specs/ngtsc-compile.spec.ts
  • Adjusted Angular compiler integration tests to reflect the new FeatureFlag suffix in directive selectors within templates.

Activity

• The author has provided detailed testing instructions, suggesting local verification has been performed.
• The PR explicitly notes this is a breaking change and may require a major version bump, indicating a thorough understanding of the impact.
• No reviewer comments or approvals have been recorded yet.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request refactors the Angular directive generator to append the FeatureFlag suffix to selectors and their corresponding inputs. This is a solid improvement for consistency and to prevent potential naming collisions in consuming applications. The changes have been applied consistently across the generator template, test files, and golden file snapshots. I've identified one pre-existing issue where a necessary input is missing from the generated directives, which I've detailed in a specific comment. Addressing this would make the generated code more robust.