Fix minor bug

Author: SwarnimDoegar

projects/imagekit-angular/src/lib/directives/ik-image.directive.ts

@@ -165,6 +165,21 @@ export class IKImageDirective implements OnChanges {
       this.config
     );
 
+    // Apply sizes attribute if provided and in responsive mode
+    if (this.sizes && this.responsive) {
+      this.renderer.setAttribute(this.el.nativeElement, 'sizes', this.sizes);
+    }
+
+    // Apply width attribute if provided
+    if (this.width) {
+      this.renderer.setAttribute(this.el.nativeElement, 'width', this.width.toString());
+    }
+
+    // Apply loading attribute if provided
+    if (this.loading) {
+      this.renderer.setAttribute(this.el.nativeElement, 'loading', this.loading);
+    }
+
     if (!this.responsive) {
       // Non-responsive image - just build a simple src
       const finalSrc = this.imagekitService.buildSrc({
@@ -206,20 +221,6 @@ export class IKImageDirective implements OnChanges {
     } else {
       this.removeSrcSet();
     }
-
-    // Apply sizes attribute if provided
-    if (this.sizes && this.responsive) {
-      this.renderer.setAttribute(this.el.nativeElement, 'sizes', this.sizes);
-    }
-
-    // Apply width attribute if provided
-    if (this.width) {
-      this.renderer.setAttribute(this.el.nativeElement, 'width', this.width.toString());
-    }
-
-    if (this.loading) {
-      this.renderer.setAttribute(this.el.nativeElement, 'loading', this.loading);
-    }
   }
 
   private setSrc(src: string): void {

test-app/e2e/csr.spec.ts-snapshots/CSR-test-case-1-chromium.txt

@@ -92,11 +92,11 @@ <h2>IKImageDirective</h2>
         [width]="300"
       />
 
-      <!-- Pass className to the image tag as it is -->
+      <!-- Pass class to the image tag as it is -->
       <img
         ikSrc="/default-image.jpg"
-        alt="Image with className"
-        className="custom-class"
+        alt="Image with class"
+        class="custom-class"
         [height]="300"
         [width]="300"
       />