Weird behavior with components with 'cookie' in name

[hvma411]

Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

Yes

Description

Hi there!

I found strange behavior with components name, or maybe it is normal behavior but and my knowledge about angular is not enough but...

I'm creating some single page website using angular 17 and I had to to create policy views for privacy policy and cookies policy. I created PrivacyPolicyComponent and after that I just simply copied it to use it as CookiesPolicyComponent (of course I changed name everywhere). After all needed changes I just simply added it to module routing so my two routes for policies looked like this:

	{
		path: 'privacy-policy',
		component: PrivacyPolicyComponent,
	},
	{
		path: 'cookies-policy',
		component: CookiesPolicyComponent,
	}

I checked my https://localhost:4200/privacy-policy url and it worked fine but https://localhost:4200/cookies-policy didn't, so I started looking for problems. I simply opened dev tools to inspect if there are some console errors but there were none. I decided to check DOM if component is there and I found it but when I hoovered it there was nothing to look at (standard tooltip with dimensions were not displayed) in my viewport and I noticed some strange user agent stylesheet added: display: none !important;. After that I added some simple console logs in ngOnInit and in constructor but nothing happened and I couldn't see it in console.

After some debugging I thought that I did some spelling mistake or something strange happened so I decided to just simply generate new component so I did it with Angular CLI and I added it in module routing to my cookies-policy route but... nothing has changed and I still couldn't see my component beeing rendered on my route.

I decided to do some more debugging and I just simply changed places of routes in array etc but still nothing helped to fix it, and then I just used the same component for both routes like this:

	{
		path: 'privacy-policy',
		component: PrivacyPolicyComponent,
	},
	{
		path: 'cookies-policy',
		component: PrivacyPolicyComponent,
	}

...and it worked, so my conclusion was: "Ok, routing works fine so why the heck my newly generated component don't work?".

I don't know why but I decided to generate a few components with 'cookie' in name like: CookiesComponent, CookiesPolicyComponent, CookieComponent, CookiePolicyComponent and none of these worked, but when I generated component with some random name like BlahBlahComponent then it worked fine.

I also checked it with rendering component with "cookie" in name directly in html file like <app-cookie></app-cookie> and there is still the same problem - component is not rendered.

So, my question is: is this feature or bug? And if it is a feature then why?

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

None

Please provide the environment you discovered this bug in (run ng version)

_                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 17.1.1
Node: 18.19.0
Package Manager: npm 10.2.3
OS: darwin arm64

Angular: 17.1.1
... animations, cli, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic
... platform-server, router, ssr

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1701.1
@angular-devkit/build-angular   17.2.1
@angular-devkit/core            17.1.1
@angular-devkit/schematics      17.1.1
@angular/fire                   17.0.1
@schematics/angular             17.1.1
rxjs                            7.8.1
typescript                      5.3.3
zone.js                         0.14.3

Anything else?

No response

[JoostK]

Angular doesn't provide default styles, and cookies-policy being hidden using a style suggests the work of an adblocker. I'd suggest opening the page in incognito mode (where extensions are typically disabled).

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}